@font-face {
	font-family: Beyonce_demo;
	src: url(../404.html);
	src: url(../404.html?#iefix) format('embedded-opentype'), url(../404.html) format('woff2'), url(../404.html) format('woff'), url(../404.html) format('truetype'), url(../404.html#Beyonce_demo) format('svg');
	font-weight: 400;
	font-style: normal
}

#read {
	position: relative;
	top: -10px;
	color: #fff;
	left: 104%;
	font-size: 14px;
	font-weight: 700;
	border: 2px solid;
	padding: 7px
}

.asasa {
	color: #fff !important;
	font-weight: 700;
	letter-spacing: 3px;
	font-size: 60px;
	padding: 0;
	margin: 0
}

.all_services--arrow .link--white:after,
.all_services--arrow .link--white:before {
	background-image: url(../images/left-arrow.png)
}

.all_services--arrow:before {
	transform: translateY(-50%) translateX(-100%);
	opacity: 0
}

.all_services--arrow:hover::before {
	transform: translateY(-50%) translateX(0);
	opacity: 1
}

.all_services--arrow:after {
	right: 0;
	opacity: 1
}

.all_services--arrow:hover::after {
	transform: translateY(-50%) translateX(0);
	opacity: 0
}

.all_services--arrow:after,
.all_services--arrow:before {
	content: "";
	background-size: 20px 15px;
	width: 20px;
	height: 15px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%)
}

.all_services--arrow span,
.all_services--arrow:after,
.all_services--arrow:before {
	display: inline-block;
	transition: transform .3s, opacity .3s
}

.all_services--arrow {
	outline: 0;
	background: 0 0;
	border: none;
	display: inline-block;
	overflow: hidden;
	position: relative;
	font-weight: 300;
	font-size: 1.6rem;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding-right: 40px;
	margin-top: 110px;
	transition: all .3s;
	color: #fff
}

.all_services--arrow.link--white {
	color: #fff
}

.all_services--arrow:hover {
	font-weight: 700;
	color: #fff
}

.all_services--arrow:hover span {
	transform: translateX(40px)
}

.home_testimonials_main {
	background-color: #000;
	background-image: url(../images/home_testimonial_back.jpg);
	background-repeat: no-repeat;
	background-size: cover
}

.home_services_back {
	background-image: url(../images/services_back.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 700px;
	text-align: center
}

.footer_bot {
	background-color: #191919;
	padding: 12px;
	text-align: center
}

.location_boxes {
	background-color: #1e1e1e;
	padding: 40px 0 80px
}

.location_box1 {
	min-height: 406px;
	background-image: url(../images/location_box1_hover.jpg);
	background-repeat: no-repeat;
	color: #fff;
	font-family: Lato;
	padding: 35px
}

.location_box1 h1 {
	color: #fff !important;
	font-family: Lato;
	font-size: 26px;
	text-transform: uppercase;
	font-weight: 600;
	border-bottom: 2px solid #fff;
	width: 40%;
	padding-bottom: 10px
}

.location_box1 h2 {
	color: #fff;
	font-family: Lato;
	font-size: 18px;
	font-weight: 400;
	width: 80%;
	line-height: 20px;
	padding-bottom: 5px;
	padding-left: 35px
}

.location_box1 h3 {
	color: #fff;
	font-family: Lato;
	font-size: 54px;
	font-weight: bolder;
	padding-left: 50px;
	margin-top: 30px
}

.location_box1 img {
	float: right;
	padding-right: 80px;
	padding-top: 30px;
	opacity: 0;
	transition: 1s
}

.location_box1:hover {
	background-image: url(../images/location_box1.jpg)
}

.location_box1:hover img {
	padding-right: 40px;
	opacity: 1
}

.location_box2 {
	min-height: 406px;
	background-image: url(../images/location_box2.jpg);
	background-repeat: no-repeat;
	color: #fff;
	font-family: Lato;
	padding: 35px;
	transition: 1s
}

.location_box2 h1 {
	color: #fff !important;
	font-family: Lato;
	font-size: 26px;
	text-transform: uppercase;
	font-weight: 600;
	border-bottom: 2px solid #fff;
	width: 35%;
	padding-bottom: 10px
}

.location_box2 h2 {
	color: #fff;
	font-family: Lato;
	font-size: 18px;
	font-weight: 400;
	width: 80%;
	line-height: 20px;
	padding-bottom: 5px;
	padding-left: 35px
}

.location_box2 h3 {
	color: #fff;
	font-family: Lato;
	font-size: 54px;
	font-weight: bolder;
	padding-left: 50px;
	margin-top: 30px
}

.location_box2 img {
	float: right;
	padding-right: 80px;
	padding-top: 30px;
	opacity: 0;
	transition: 1s
}

.location_box2:hover {
	background-image: url(../images/location_box2_hover.jpg)
}

.location_box2:hover img {
	padding-right: 40px;
	opacity: 1
}

.location_icon {
	background-image: url(../images/box_location_icon.png);
	background-repeat: no-repeat
}

.message_icon {
	background-image: url(../images/box_message_icon.png);
	background-repeat: no-repeat
}

.phone_icon {
	background-image: url(../images/box_phone_icon.png);
	background-repeat: no-repeat
}

.testimonial_section {
	background-image: url(../images/uifstechnologies/testimonials_background.jpg);
	background-color: #000
}

.upper_footer {
	background-color: #1d2621;
	padding-top: 60px;
	text-align: center;
	background-image: url(../images/upper_footer.jpg);
	height: 330px
}

.upper_footer_img {
	height: 200px;
	margin: 0 180px;
	transition: all .2s linear;
	margin-top: 50px;
	background-image: url(../images/upper_footer_logo_hover.png);
	background-repeat: no-repeat;
	background-position: center
}

.upper_footer_img:hover {
	margin-top: 0;
	background-image: url(../images/upper_footer_logo_hover.png);
	background-repeat: no-repeat;
	background-position: center
}

.footer_new {
	background-color: #232323
}

.work_bottom {
	background-image: url(../images/work_bottom.jpg);
	background-repeat: no-repeat;
	background-color: #000;
	text-align: center;
	padding-bottom: 180px
}

.work_bottom h1 {
	font-size: 56px;
	color: #fff !important;
	padding-top: 20px;
	padding-bottom: 15px
}

.link--arrow.link--white:after,
.link--arrow.link--white:before {
	background-image: url(../images/left-arrow.png)
}

.link--arrow:before {
	transform: translateY(-50%) translateX(-100%);
	opacity: 0
}

.link--arrow:hover::before {
	transform: translateY(-50%) translateX(0);
	opacity: 1
}

.link--arrow:after {
	opacity: 1
}

.link--arrow:hover::after {
	transform: translateY(-50%) translateX(0);
	opacity: 0
}

.link--arrow:after,
.link--arrow:before {
	content: "";
	background-size: 20px 15px;
	width: 20px;
	height: 15px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%)
}

.link--arrow span,
.link--arrow:after,
.link--arrow:before {
	display: inline-block;
	transition: transform .3s, opacity .3s
}

.link--arrow {
	outline: 0;
	background: 0 0;
	border: none;
	display: inline-block;
	overflow: hidden;
	position: relative;
	font-weight: 300;
	font-size: 1.6rem;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding-right: 40px;
	transition: all .3s
}

.link--arrow.link--white {
	color: #fff;
	margin-top: 0
}

.link--arrow:hover {
	font-weight: 700
}

.link--arrow:hover span {
	transform: translateX(40px)
}

.bottom-cta {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 120px 0
}

.bottom-cta__title {
	font-family: Oswald, sans-serif;
	font-weight: 500;
	z-index: 10;
	align-items: center;
	color: transparent;
	text-transform: uppercase;
	font-size: 14.4rem;
	text-decoration: none;
	-webkit-text-stroke: .1rem rgba(255, 255, 255, .5);
	padding-bottom: 4rem;
	transition: .4s ease-in-out
}

.bottom-cta__title>div>div {
	padding: 0 1.6rem
}

.bottom-cta p {
	overflow: hidden;
	color: #ff1c3b;
	font-size: 2.2rem;
	line-height: 1.6rem;
	height: 2rem
}

.bottom-cta p span {
	position: relative;
	overflow: hidden;
	display: inline-block;
	height: 2rem
}

.bottom-cta p span .bar {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #ff1c3b;
	top: 0;
	left: 0;
	transform: translateX(-101%)
}

.bottom-cta__image {
	position: absolute;
	width: 40rem;
	overflow: hidden;
	height: 39rem;
	margin-top: -2.4rem
}

.bottom-cta__image-inner {
	overflow: hidden;
	height: 400px
}

.bottom-cta__image img {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	z-index: 1
}

.section--dark {
	background-color: #1f2823
}

.wrapper--home .section--bottom-cta .section__inner {
	padding-top: 32rem
}

.section__inner--flex {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap
}

.section__inner {
	position: relative;
	width: 100%;
	border-left: .1rem solid rgba(255, 255, 255, .05);
	border-right: .1rem solid rgba(255, 255, 255, .05);
	padding: 0;
	z-index: 10
}

.section__inner:before {
	position: absolute;
	width: 50%;
	height: 100%;
	left: 50%;
	top: 0;
	margin-left: -25%;
	border-left: .1rem solid rgba(255, 255, 255, .05);
	border-right: .1rem solid rgba(255, 255, 255, .05);
	content: '';
	pointer-events: none
}

.bottom-cta__title:hover {
	-webkit-text-stroke: .1rem transparent
}

.image-slider__slide {
	position: relative;
	display: block;
	margin-bottom: 50px;
	filter: drop-shadow(0px 0px 14px #000);
}

.image-slider__details1 {
	position: absolute;
	width: 100%;
	top: 0;
	left: 30px;
	opacity: 0;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
	-webkit-transition: all .4s ease-in-out .2s;
	transition: all .7s ease-in-out .2s;
	color: #fff042;
	padding: 5vw;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	height: 100%
}

.image-slider__slide:hover .image-slider__details1 {
	opacity: 1;
	-webkit-transform: translate(0, -12%);
	transform: translate(0, -12%)
}

.image-slider__name1 {
	color: #fff;
	font-size: 55px;
	font-weight: 600;
	width: 100%;
	line-height: 5.2vw;
	margin: 0;
	align-self: flex-end;
	text-align: left;
	position: absolute;
	left: -20px;
	bottom: -20px
}

.image-slider__details {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	opacity: 0;
	-webkit-transform: translate(-50%, -100%);
	transform: translate(-50%, -100%);
	-webkit-transition: all .4s ease-in-out .2s;
	transition: all .4s ease-in-out .2s;
	color: #fff042;
	padding: 5vw;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	height: 100%
}

.image-slider__slide:hover .image-slider__details {
	opacity: 1;
	-webkit-transform: translate(-50%, -80%);
	transform: translate(-50%, -80%)
}

.image-slider__text {
	color: #fff;
	text-align: right;
	font-size: 1.77vw;
	width: 100%;
	font-weight: 300
}

.image-slider__name {
	color: #fff042;
	font-size: 55px;
	font-weight: 600;
	width: 100%;
	line-height: 5.2vw;
	margin: 0;
	align-self: flex-end;
	text-align: center
}

.overlay_voilet {
	position: absolute;
	mix-blend-mode: multiply;
	-webkit-transition: all .4s ease-in-out 0s;
	transition: all .4s ease-in-out 0s;
	left: 0;
	bottom: 0;
	right: 0;
	top: 0;
	background-color: #5e2893;
	opacity: 0
}

.image-slider__slide:hover .overlay_voilet {
	opacity: 1
}

.overlay_yellow {
	position: absolute;
	mix-blend-mode: multiply;
	-webkit-transition: all .4s ease-in-out 0s;
	transition: all .4s ease-in-out 0s;
	left: 0;
	bottom: 0;
	right: 0;
	top: 0;
	background-color: #f41b44;
	opacity: 0
}

.image-slider__slide:hover .overlay_yellow {
	opacity: 1
}

.image-slider__slide-overlay {
	position: absolute;
	mix-blend-mode: multiply;
	-webkit-transition: all .4s ease-in-out 0s;
	transition: all .4s ease-in-out 0s;
	left: 0;
	bottom: 0;
	right: 0;
	top: 0;
	background-color: #00adb1;
	opacity: 0
}

.image-slider__slide:hover .image-slider__slide-overlay {
	opacity: 1
}

.home_work_section {
	background-color: #040404;
	padding: 100px 0 0
}

.home_work_section_left img {
	width: 100%;
	margin-right: 50px
}

.home_work_section img {
	width: 100%;
}

.home_work_section_left {
	background-color: #000
}

.home_work_section_right {
	padding-top: 170px
}

#top_fixed {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 0
}

#b {
	margin-top: 60%
}

.home_about_section {
	background-color: #222020
}

.aaaaa {
	position: absolute;
	top: 28%;
	left: 37%
}

.we_are_hero1 {
	font-family: Lato;
	letter-spacing: 3px;
	font-size: 60px;
	color: #fff !important;
	font-weight: 100;
	line-height: 60px !important;
	position: absolute;
	top: 30%;
	left: 20%;
	width: 40%;
	margin: 0 auto;
	text-shadow: 0 0 25px #131313;
	text-align: left
}

.we_are_hero1 h1 {
	color: #fff !important;
	font-weight: 100;
	margin: 0;
	letter-spacing: 3px;
	font-size: 60px
}

.we_are_hero1 h2 {
	color: #fff !important;
	font-weight: 700;
	letter-spacing: 3px;
	font-size: 60px;
	padding: 0;
	margin: 0
}

.we_are_hero1 p {
	color: #fff !important;
	font-weight: 500;
	font-size: 10px;
	font-family: Lato !important;
	padding-top: 0;
	margin: 0
}

.scroll-down {
	position: absolute;
	width: 150px;
	bottom: 20px;
	left: 50%;
	margin-left: -75px;
	z-index: 50;
	display: block;
	text-align: center;
	font-size: 12px;
	-webkit-font-smoothing: antialiased
}

.btn,
.scroll-down {
	white-space: nowrap
}

.scroll-down .icon {
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
	width: 26px;
	height: 44px;
	display: block;
	border-radius: 13px;
	border: 2px solid #b3b3b3;
	margin: 0 auto
}

.scroll-down .icon:before,
.scroll-down span {
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease
}

.scroll-down .icon:before {
	transition: all .3s ease;
	width: 6px;
	height: 6px;
	-webkit-animation: scrollDownKnobAnimation 2s ease infinite;
	-moz-animation: scrollDownKnobAnimation 2s ease infinite;
	-o-animation: scrollDownKnobAnimation 2s ease infinite;
	animation: scrollDownKnobAnimation 2s ease infinite;
	position: absolute;
	top: 6px;
	border-radius: 50%;
	background-color: #b3b3b3;
	content: '';
	left: 50%;
	margin-left: -3px
}

a:active,
a:hover {
	outline: 0
}

a:focus,
a:hover {
	color: #23527c
}

*,
:after,
:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}

.video_over {
	background-image: url(../images/video_over.png);
	width: 100%;
	min-height: 750px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9
}

.img-zoom {
	padding-top: 10px;
	transform: scale(1);
	-webkit-transition: all .1s ease-in-out;
	-moz-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	-ms-transition: all .1s ease-in-out
}

.img-zoom:hover {
	transform: scale(1.2)
}

.width_100 {
	width: 100% !important
}

.pad_0 {
	padding: 0 !important
}

.blog_arrow_position {
	position: absolute;
	bottom: 75px;
	right: 110px
}

.blog_arrow_position1 {
	position: absolute;
	bottom: 15px;
	right: 40px
}

.footer_icons_text {
	color: #f0f8ff;
	padding-top: 15px;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px
}

.footer_icons_row {
	margin: 0 auto;
	margin-bottom: 50px
}

.footer_icons {
	width: 95px;
	height: 95px;
	line-height: 95px;
	border-radius: 50%;
	background: #2d3544;
	margin: 0 auto
}

.footer_icons_title {
	font-family: Lato;
	font-size: 18px;
	font-weight: 500;
	margin-top: 15px;
	color: #fff;
	border-bottom: 1px solid #333 !important
}

.home_testimonial_title {
	font-size: 50px;
	margin: 0;
	color: #fff !important;
	text-align: center;
	font-family: Lato;
	padding-bottom: 10px;
	padding-top: 100px
}

.skills_projects_boxes {
	padding: 0 15% 3% 15%
}

.skills_main_background {
	background-color: #15141a;
	background-image: url(../images/uifstechnologies/1111.svg);
	background-position: top right;
	background-size: 100%;
	background-repeat: no-repeat
}

.skills_bg {
	background-color: #1c1f28 !important
}

* {
	margin: 0;
	padding: 0
}

body {
	background: #fff;
	font-weight: 400;
	position: relative;
	font-size: 14px;
	font-family: Montserrat, sans-serif
}

#wrap {
	position: relative;
	width: 100%;
	overflow: hidden
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 400;
	color: #141414;
	font-family: Montserrat, sans-serif;
	font-weight: 700
}

h1 {
	font-size: 42px
}

h2 {
	font-size: 36px;
	font-weight: 700
}

h3 {
	font-size: 30px
}

h4 {
	font-size: 24px
}

h5 {
	font-size: 18px
}

h6 {
	font-size: 14px;
	font-weight: 700
}

a {
	text-decoration: none !important;
	font-family: Montserrat, sans-serif
}

ul {
	margin-bottom: 0
}

li {
	list-style: none
}

a {
	text-decoration: none;
	color: #141414
}

p.intro-small {
	font-style: italic;
	color: #f5f5f5;
	width: 80%;
	margin: 0 auto
}

section {
	position: relative;
	overflow: hidden;
	width: 100%;
	background: #fff
}

.slides-inner h5 {
	margin: 0
}

.btn {
	background: #eeb013;
	display: inline-block;
	font-size: 12px;
	text-transform: uppercase;
	padding: 10px 50px;
	font-weight: 700;
	border-radius: 0;
	letter-spacing: 1px;
	color: #141414;
	position: relative;
	overflow: hidden
}

.l-left {
	float: left;
	position: relative;
	z-index: 999;
	padding-top: 2px;
	padding-left: 50px;
	line-height: 69px
}

.l-left_icon {
	float: left;
	position: relative;
	z-index: 999;
	padding-top: 10px;
	padding-left: 50px
}

.l-left_icon img {
	opacity: 1
}

.l-right {
	float: right
}

.display_none_for_desktop {
	display: none
}

.topnav_services_formobile {
	padding-top: 15px;
	padding-left: 30px
}

.topnav_services_formobile a {
	color: #fff;
	font-size: 15px;
	font-weight: 400;
	line-height: 18px
}

.wistia_embed {
	width: 100%;
	max-height: 450px;
	border: 0
}

.animation-element {
	opacity: 0;
	position: relative
}

.animation-element.slide-left {
	opacity: 0;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-o-transition: all .5s linear;
	transition: all .5s linear;
	-moz-transform: translate3d(-500px, 0, 0);
	-webkit-transform: translate3d(-500px, 0, 0);
	-o-transform: translate(-500px, 0);
	-ms-transform: translate(-500px, 0);
	transform: translate3d(-500px, 0, 0)
}

.animation-element.slide-left1 {
	opacity: 0;
	-moz-transition: all 1s linear;
	-webkit-transition: all 1s linear;
	-o-transition: all 1s linear;
	transition: all 1s linear;
	-moz-transform: translate3d(-300px, 0, 0);
	-webkit-transform: translate3d(-300px, 0, 0);
	-o-transform: translate(-300px, 0);
	-ms-transform: translate(-300px, 0);
	transform: translate3d(-300px, 0, 0)
}

.animation-element.slide-right {
	opacity: 0;
	-moz-transition: all 1s linear;
	-webkit-transition: all 1s linear;
	-o-transition: all 1s linear;
	transition: all 1s linear;
	-moz-transform: translate3d(500px, 0, 0);
	-webkit-transform: translate3d(500px, 0, 0);
	-o-transform: translate(500px, 0);
	-ms-transform: translate(500px, 0);
	transform: translate3d(500px, 0, 0)
}

.animation-element.slide-right1 {
	opacity: 0;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-o-transition: all .5s linear;
	transition: all .5s linear;
	-moz-transform: translate3d(300px, 0, 0);
	-webkit-transform: translate3d(300px, 0, 0);
	-o-transform: translate(300px, 0);
	-ms-transform: translate(300px, 0);
	transform: translate3d(300px, 0, 0)
}

.animation-element.slide-left.in-view,
.animation-element.slide-left1.in-view {
	opacity: 1;
	-moz-transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	-o-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	transform: translate3d(0, 0, 0)
}

.animation-element.slide-right.in-view,
.animation-element.slide-right1.in-view {
	opacity: 1;
	-moz-transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	-o-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	transform: translate3d(0, 0, 0)
}

.services_slides_banners {
	height: 100vh;
	display: flex;
	position: relative;
	flex-direction: column;
	width: 100vw
}

.home_ourwork_img {
	padding: 0
}

.home_ourwork_main {
	height: 100vh
}

.vertical_full {
	height: 100vh
}

.flip_iona {
	transition: 1s;
	background-image: url(../images/work/new/img-6.jpg);
	background-repeat: no-repeat;
	width: 100%;
	position: absolute;
	background-size: cover;
	background-color: bisque
}

.flip_iona:hover {
	background-image: url(../images/work/new/img-6_hover.jpg);
	background-repeat: no-repeat;
	background-size: cover
}

.flip_lobital {
	width: 100%;
	height: 250px;
	background-image: url(../images/work/new/img-2.jpg);
	background-size: cover;
	text-align: center;
	transition: 1s
}

.flip_lobital:hover {
	width: 100%;
	height: 250px;
	background-image: url(../images/work/new/img-2_hover.jpg);
	background-size: cover
}

.flip_box_iona {
	background-image: url(../images/work/new/img-6.jpg);
	background-repeat: no-repeat;
	width: 100%;
	position: absolute;
	background-size: cover
}

.flip_box_iona1 {
	background-image: url(../images/work/new/img-6_hover.jpg);
	background-repeat: no-repeat;
	width: 100%;
	position: absolute;
	background-size: cover;
	left: 500px;
	transition: transform 1s
}

.flip-box_gayze {
	background-image: url(../images/work/new/img-3.jpg);
	position: absolute;
	width: 100%;
	height: 250px;
	background-size: cover;
	transition: 1s
}

.flip-box_gayze:hover {
	background-image: url(../images/work/new/img-3_hover.jpg)
}

.flip-box-inner_gayze {
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	transition: transform 1s
}

.flip-box_gayze:hover .flip-box-inner_gayze {
	transform: rotate(180deg)
}

.flip-box-back_gayze,
.flip-box-front_gayze {
	position: absolute;
	width: 100%;
	height: 100%;
	visibility: visible
}

.flip-box-front_gayze {
	color: #000;
	transform: rotate(0)
}

.flip-box-back_gayze {
	background-color: #555;
	color: #fff;
	transform: rotate(180deg)
}

.flip-box {
	background-color: transparent;
	width: 100%;
	height: 100vh;
	perspective: 1000px
}

.flip-box-inner {
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	transition: transform .8s;
	transform-style: preserve-3d
}

.flip-box:hover .flip-box-inner {
	transform: rotateY(180deg)
}

.flip-box-back,
.flip-box-front {
	position: absolute;
	width: 100%;
	height: 100%;
	backface-visibility: hidden
}

.flip-box-front {
	background-color: #bbb;
	color: #000;
	background-image: url(../images/work/new/img-4_hover.jpg);
	background-size: cover
}

.flip-box-back {
	background-color: #555;
	color: #fff;
	transform: rotateY(180deg);
	background-image: url(../images/work/new/img-4.jpg);
	background-size: cover
}

.flip-box-back h2 {
	color: #fff;
	line-height: 100%
}

.view_all_float_button a {
	position: absolute;
	width: 130px;
	height: 110px;
	background-color: #833ab4;
	color: #fdd71d;
	z-index: 999999;
	right: 0;
	padding: 7px;
	top: 50px;
	border-radius: 18px;
	box-shadow: 0 30px 100px #000;
	text-align: center;
	font-family: beyonce;
	font-size: 32px;
	font-weight: 600;
	letter-spacing: 4px;
	padding-top: 20px;
	line-height: 36px;
	text-shadow: 0 0 30px #000
}

.view_all_float_button a:hover {
	color: #fff
}

.image_grayscale {
	height: 420px;
	background-image: url(../images/work/new/img-1_hover.jpg);
	background-size: cover;
	transition: 1s
}

.image_grayscale:hover {
	background-image: url(../images/work/new/img-1.jpg);
	background-size: cover
}

.flip-box3 {
	height: 420px;
	width: 100%;
	background-image: url(../images/work/new/img-5_hover.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	transition: 1.5s
}

.flip-box3:hover {
	height: 420px;
	background-image: url(../images/work/new/img-5.jpg)
}

.flip-box1 {
	background-color: transparent;
	perspective: 1000px
}

.flip-box-inner1 {
	position: relative;
	text-align: center;
	transition: transform .8s;
	transform-style: preserve-3d
}

.flip-box1:hover .flip-box-inner1 {
	transform: rotateX(180deg)
}

.flip-box-back1,
.flip-box-front1 {
	width: 100%;
	height: 100%;
	backface-visibility: hidden
}

.flip-box-front1 {
	color: #000
}

.flip-box-back1 {
	background-color: #555;
	color: #fff;
	transform: rotateY(180deg)
}

.flip-box-back1 h2 {
	color: #fff;
	line-height: 100%
}

.forMobile {
	display: none
}

.video_image {
	border-radius: 7px;
	background-image: url(../images/testimonials/1.1.jpg);
	background-position: top right;
	background-size: cover;
	background-repeat: no-repeat;
	margin: 5%;
	height: 430px
}

.video_image img {
	width: 70px;
	height: 70px;
	text-align: center;
	margin: 0 auto;
	left: 46%;
	top: 40%;
	position: absolute
}

.home_testimonial_main {
	padding: 50px 0;
	height: 670px
}

.home_testimonial_left {
	padding: 70px 50px 70px 132px;
	margin-top: 10px
}

.home_testimonial_left h1 {
	color: #e2e2e2 !important;
	font-size: 21px;
	line-height: 46px;
	font-family: Lato;
	font-weight: 100
}

.home_testimonial_left p {
	padding-top: 15px;
	font-size: 15px;
	color: #7b7b7b
}

.home_video_banner_text {
	background: rgb(0, 0, 0, .6);
	padding: 15px;
	width: 40%;
	height: 63%;
	position: absolute;
	border-radius: 10px;
	z-index: 9;
	top: 23%;
	left: 10%;
	color: #fff;
	font-family: clear sans
}

.red_arrow1 {
	text-align: right;
	padding-right: 20px;
	padding-bottom: 10px
}

.white_arrow1 {
	text-align: right;
	padding-right: 20px;
	padding-bottom: 10px
}

.home_video_banner_text h1 {
	text-align: left;
	font-family: lato;
	font-size: 44px;
	font-weight: bolder;
	padding-left: 30px;
	color: #fff;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #fff070 0, #fff 35%, #ffd3 66%, #d7edff 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite
}

span.stretch {
	display: inline-block;
	-webkit-transform: scale(4, 1);
	-moz-transform: scale(4, 1);
	-ms-transform: scale(4, 1);
	-o-transform: scale(4, 1);
	transform: scale(4, 1);
	margin-right: 20px;
	font-size: 18px
}

.home_video_banner_text ul {
	text-align: left;
	padding-left: 40px;
	padding-top: 20px
}

.home_video_banner_text ul li {
	font-family: clear sans;
	font-weight: 400;
	font-size: 20px;
	padding-bottom: 12px
}

.home_video_banner_text ul li a {
	color: #fff
}

.home_video_banner_text ul li a:hover {
	color: #f3b62c
}

.techno_text {
	padding: 12% 0 12% 5%
}

.technology h1 {
	font-size: 60px;
	color: #fff;
	font-weight: 600;
	font-family: quantify;
	text-shadow: 0 0 34px #8c4b1a
}

.technology p {
	padding-top: 20px;
	color: #fff;
	font-size: 22px;
	line-height: 35px;
	font-family: lato;
	padding-bottom: 30px
}

.technology {
	background: #f6f6f6;
	background-image: url(../images/uifstechnologies/skills-bg.jpg);
	background-size: cover;
	padding-top: 7%;
	min-height: 740px
}

.techImages {
	padding-left: 10%
}

.technology .techImages>li {
	float: left;
	list-style: none;
	margin: 0 10px;
	text-align: center;
	width: 90px;
	transition: 1s
}

.technology .techImages>li .tech {
	height: 90px;
	width: 90px;
	margin-bottom: 20px;
	transition: 1s
}

.tech_cake:hover {
	background-image: url(../images/techno/cake.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_cake {
	background-image: url(../images/techno/cake_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_ionic:hover {
	background-image: url(../images/techno/ionic.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_ionic {
	background-image: url(../images/techno/ionic_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_typescript:hover {
	background-image: url(../images/techno/typescript.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_typescript {
	background-image: url(../images/techno/typescript_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_wordpress:hover {
	background-image: url(../images/techno/wordpress.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_wordpress {
	background-image: url(../images/techno/wordpress_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_saas:hover {
	background-image: url(../images/techno/saas.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_saas {
	background-image: url(../images/techno/saas_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_phonegap:hover {
	background-image: url(../images/techno/phonegap.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_phonegap {
	background-image: url(../images/techno/phonegap_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_cordova:hover {
	background-image: url(../images/techno/cordova.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_cordova {
	background-image: url(../images/techno/cordova_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_mysql:hover {
	background-image: url(../images/techno/mysql.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_mysql {
	background-image: url(../images/techno/mysql_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_sencha:hover {
	background-image: url(../images/techno/sencha.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_sencha {
	background-image: url(../images/techno/sencha_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_extension:hover {
	background-image: url(../images/techno/extension.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_extension {
	background-image: url(../images/techno/extension_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_ajex:hover {
	background-image: url(../images/techno/ajex.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_ajex {
	background-image: url(../images/techno/ajex_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_python:hover {
	background-image: url(../images/techno/python.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_python {
	background-image: url(../images/techno/python_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_angular:hover {
	background-image: url(../images/techno/angular1.png) !important;
	animation-name: floating;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	transition: 1s
}

.tech_angular {
	background-image: url(../images/techno/angular_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_php:hover {
	background-image: url(../images/techno/php1.png) !important;
	transform: rotate(0)
}

.tech_php {
	background-image: url(../images/techno/php_hover.png) !important;
	transform: rotate(8deg);
	transition: .5s;
	background-position: center;
	background-size: 100% 100%
}

.tech_node:hover {
	background-image: url(../images/techno/node1.png) !important
}

.tech_node {
	background-image: url(../images/techno/node_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_laravel:hover {
	background-image: url(../images/techno/laravel.png) !important;
	transform: rotate(-8deg);
	transition: .5s
}

.tech_laravel {
	background-image: url(../images/techno/laravel_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_codeigniter:hover {
	background-image: url(../images/techno/codeigniter1.png) !important;
	animation-name: floating;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out
}

.tech_codeigniter {
	background-image: url(../images/techno/codeigniter_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_react:hover {
	background-image: url(../images/techno/react1.png) !important;
	transform: rotate(10deg);
	transition: .5s
}

.tech_react {
	background-image: url(../images/techno/react_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_html:hover {
	background-image: url(../images/techno/html1.png) !important;
	transform: rotate(0);
	transition: .5s
}

.tech_html {
	background-image: url(../images/techno/html_hover.png) !important;
	background-position: center;
	background-size: 100% 100%;
	transform: rotate(15deg);
	padding-left: 30px
}

.tech_javascript:hover {
	background-image: url(../images/techno/javascript1.png) !important;
	animation-name: floating;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out
}

.tech_javascript {
	background-image: url(../images/techno/javascript_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_jquery:hover {
	background-image: url(../images/techno/jquery1.png) !important
}

.tech_jquery {
	background-image: url(../images/techno/jquery_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_bootstrap:hover {
	background-image: url(../images/techno/bootstrap1.png) !important;
	animation-name: floating;
	animation-duration: .5s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out
}

.tech_bootstrap {
	background-image: url(../images/techno/bootstrap_hover.png) !important;
	background-position: center;
	background-size: 100% 100%
}

.tech_opacity {
	background-image: url(../images/techno/bootstrap_hover.png) !important;
	background-position: center;
	background-size: 100% 100%;
	opacity: 0
}

.technology .techImages .tech>img {
	max-width: 75px
}

.skill_default {
	display: inline-block
}

#changetext {
	transition: all 1s ease
}

.blue {
	color: #fff !important;
	position: relative;
	-webkit-animation-name: example;
	-webkit-animation-duration: 1s;
	animation-name: example;
	animation-duration: .3s
}

@keyframes example {
	from {
		left: -500px
	}

	to {
		left: 0
	}
}

.tech_bootstrap:hover .skill_default {
	display: none !important
}

.techImages.forImageAbout {
	display: none
}

#thin_menu {
	display: none;
	background-color: rgba(17, 20, 23, .85);
	border-bottom: 2px solid #1383d2ab
}

.dropdown ul li {
	padding-left: 25px !important
}

.services_slide img {
	width: 100% !important;
	height: 100%
}

.topnav {
	z-index: 999999;
	float: right;
	padding-right: 10px;
	height: 100%;
	display: flex;
	align-items: center;
	padding-top: 0px
}

.topnav ul {
	display: flex;
	margin: 0;
	padding-right: 60px;
	text-shadow: 0 0 25px #131313
}

.topnav ul li {
	margin-left: 55px
}

.topnav ul li ul li {
	padding-left: 10px;
	margin-left: 0
}

.topnav a {
	font-family: Lato;
	float: left;
	display: block;
	text-align: center;
	color: #fff;
	letter-spacing: 2px;
	font-size: 14px;
	position: relative
}

.active {
	color: #fff
}

.topnav a:hover {
	color: #fff;
	border-bottom: 2px solid #e62020
}

.topnav .icon {
	display: none
}

.topnav_thin {
	z-index: 999999;
	float: right;
	transition: 1s;
	padding-right: 10px;
	height: 100%;
	display: flex;
	align-items: center;
	padding-top: 0px
}

.topnav_thin ul {
	display: flex;
	margin: 0;
	padding-right: 60px
}

.topnav_thin ul li {
	margin-left: 55px
}

.topnav_thin ul li ul li {
	margin-left: 0
}

.topnav_thin a {
	font-family: Lato;
	float: left;
	display: block;
	text-align: center;
	color: #fff;
	letter-spacing: 2px;
	font-size: 14px;
	position: relative
}

.topnav_thin a:hover {
	color: #fff;
	border-bottom: 2px solid #e62020
}

.topnav_thin a.active {
	color: #fff;
	border-bottom: 3px solid #e62020
}

.topnav_thin .icon {
	display: none
}

.btn_slider {
	cursor: pointer;
	background-color: transparent;
	padding-right: 10px
}

#prevButton {
	cursor: pointer;
	border: transparent;
	background-color: transparent
}

#nextButton {
	cursor: pointer;
	border: transparent;
	background-color: transparent;
	padding-left: 5px
}

#prevButton:focus {
	background-color: transparent
}

#prevButton:visited {
	background-color: transparent
}

#prevButton:active {
	background-color: transparent
}

.btn_slider:hover {
	cursor: pointer;
	background-color: transparent;
	border: 1px solid #fff;
	padding-right: 10px
}

.btn_slider:focus {
	cursor: pointer;
	background-color: transparent;
	border: 1px solid transparent !important;
	padding-right: 10px
}

.btn_slider:active {
	cursor: pointer;
	background-color: transparent;
	border: 1px solid transparent !important;
	padding-right: 10px
}

main {
	display: flex;
	position: relative;
	flex-direction: column;
	width: 100vw;
	height: 100vh
}

.services_controls {
	padding: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 70px;
	min-height: 70px;
	position: absolute;
	bottom: 8%;
	left: 5%
}

.services_link {
	padding: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 70px;
	min-height: 70px;
	position: absolute;
	bottom: 30%;
	left: 7%
}

.services_link a {
	color: #fff;
	font-size: 22px;
	font-weight: 300;
	font-family: lato
}

.services_link a:hover {
	color: #fff;
	font-size: 22px;
	font-weight: 300;
	font-family: lato;
	text-decoration: underline !important
}

.services_slides_container {
	position: relative;
	overflow: hidden;
	display: flex;
	flex: 1
}

.services_slide {
	position: absolute;
	font-size: 90px;
	font-weight: 700;
	color: rgba(255, 255, 255, .9);
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: calc(100% /2);
	width: 100%;
	background-size: cover
}

.slides-inner {
	position: relative;
	height: 100%;
	width: 100%;
	overflow: hidden
}

@media screen and (max-width:600px) {
	.topnav a {
		display: none
	}

	.topnav a.icon {
		float: right;
		display: block
	}
}

@media screen and (max-width:600px) {
	.topnav.responsive {
		position: relative
	}

	.topnav ul {
		display: table-cell
	}

	.topnav.responsive .icon {
		position: absolute;
		right: 0;
		top: 0
	}

	.topnav.responsive a {
		float: none;
		display: block;
		text-align: left
	}
}

.slide {
	position: absolute;
	z-index: 1;
	background-size: cover;
	background-position: center center;
	width: 90%;
	height: 450px
}

.slide blockquote {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	margin: 0;
	border: 10px
}

.slide blockquote p {
	font-family: Baskerville;
	color: #fff;
	padding: 0;
	font-size: 45px;
	font-style: italic;
	text-align: center;
	max-width: 50%;
	margin-left: auto;
	margin-right: auto
}

.slide cite {
	font-family: ProximaNova, Helvetica Neue;
	font-weight: 700;
	letter-spacing: 3px;
	font-style: normal;
	font-size: 13px;
	text-align: center;
	color: #b5b5b5;
	display: block;
	text-transform: uppercase
}

.slide .play-button {
	width: 70px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	cursor: pointer;
	display: block
}

.slide.video-active .close-button {
	background-image: url(../images/testimonials/close_close.png);
	background-size: 57px auto;
	background-repeat: no-repeat;
	height: 38px;
	width: 36px;
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 10;
	cursor: pointer;
	background-color: transparent;
	border: none
}

.quote-1 {
	background-image: url(../images/testimonials/1.jpg);
	background-position: top right
}

.quote-2 {
	background-image: url(../images/testimonials/2.jpg);
	background-position: top left
}

.quote-3 {
	background-image: url(../images/testimonials/3.jpg);
	background-position: top left
}

.quote-4 {
	background-image: url(../images/testimonials/4.jpg);
	background-position: top center
}

.quote-5 {
	background-image: url(../images/testimonials/5.jpg);
	background-position: top left
}

.slide.active {
	z-index: 5
}

.slide.video-active .quote-video {
	visibility: visible !important;
	position: absolute;
	top: 0;
	height: 600px !important
}

.avatars {
	margin-top: 0;
	text-align: center;
	padding-left: 0;
	z-index: 999999999;
	position: relative;
	top: 465px
}

.avatars li {
	transform: matrix(1, 0, 0, 1, 0, 0);
	height: 80px;
	width: 80px;
	transition: transform .2s ease-in-out;
	display: inline-block;
	text-align: center;
	margin: auto 10px
}

.avatars li a {
	cursor: pointer
}

.avatars li#avatar-1 {
	transition: transform .4s ease
}

.avatars li#avatar-2 {
	transition: transform .5s ease
}

.avatars li#avatar-3 {
	transition: transform .6s ease
}

.avatars li#avatar-4 {
	transition: transform .7s ease
}

.avatars li#avatar-5 {
	transition: transform .7s ease
}

.avatars li.video-active#avatar-1 {
	transform: matrix(.75, 0, 0, .75, 30, 10)
}

.avatars li.video-active#avatar-2 {
	transform: matrix(.75, 0, 0, .75, 10, 10)
}

.avatars li.video-active#avatar-3 {
	transform: matrix(.75, 0, 0, .75, -10, 10)
}

.avatars li.video-active#avatar-4 {
	transform: matrix(.75, 0, 0, .75, -30, 10)
}

.avatars li.video-active#avatar-5 {
	transform: matrix(.75, 0, 0, .75, -50, 10)
}

.avatars li span {
	background-image: url(../images/testimonials/avatar-sprites.png);
	height: 80px;
	width: 80px;
	display: inline-block;
	background-size: 80px auto;
	border-radius: 200px;
	border: 2px solid #fff
}

.avatars #avatar-2 span {
	background-position: 0 -80px
}

.avatars #avatar-3 span {
	background-position: 0 -159px
}

.avatars #avatar-4 span {
	background-position: 0 -240px
}

.avatars #avatar-5 span {
	background-position: 0 -320px
}

.avatars li .logo {
	background-image: url(../images/testimonials/avatar-sprites.png);
	height: 38px;
	background-size: 80px auto;
	display: none
}

.avatars #avatar-1 .logo {
	background-position: 25px -239px;
	margin-top: 3px;
	display: none
}

.avatars #avatar-2 .logo {
	background-position: 23px -276px;
	margin-top: 1px;
	display: none
}

.avatars #avatar-3 .logo {
	background-position: 10px -313px;
	margin-top: 10px;
	display: none
}

@media screen and (max-width:375px) and (device-height :812px) and (-webkit-device-pixel-ratio :3) {
	.portfolio_title {
		margin-top: 75px
	}

	.owl-item img {
		height: 500px
	}

	#project-term {
		margin-bottom: 40px;
		padding-top: 20px;
		text-align: center
	}

	.carousel_text {
		font-size: 20px
	}

	.we_are_hero {
		font-size: 24px;
		font-family: lato;
		font-weight: 800;
		text-transform: uppercase;
		line-height: 40px;
		top: 23%;
		left: 7%
	}

	.banner_hero_main {
		height: 100vh;
		background-color: #2a2e31
	}

	#hero_myVideo {
		margin-top: 70%
	}

	.hero_service_main {
		position: relative;
		bottom: 0
	}

	.hero_service {
		margin-bottom: 20px;
		margin-top: 20px;
		background-color: #eeb013;
		margin-left: 30px;
		margin-right: 30px;
		padding: 10px;
		border-radius: 28px
	}

	.hero_service1 {
		margin-bottom: 20px;
		background-color: #eeb013;
		margin-left: 30px;
		margin-right: 30px;
		padding: 10px;
		border-radius: 28px
	}

	.hero_service a,
	.hero_service1 a {
		font-family: open sans;
		font-size: 24px;
		font-weight: 600;
		color: #212121;
		text-shadow: none
	}

	.iphone-x {
		display: none
	}

	.portfolio_title {
		font-size: 52px;
		color: #2a2e31;
		float: left;
		font-weight: 800;
		font-family: open sans;
		line-height: 50px
	}

	.slide blockquote p {
		font-family: Baskerville;
		color: #fff;
		padding: 0;
		font-size: 30px;
		font-style: italic;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		max-width: 100%
	}

	.slide {
		top: 60px
	}

	.sld375 {
		display: block
	}

	.services_link {
		display: none
	}

	.blue_copyright p {
		padding-bottom: 0;
		font-size: 16px;
		float: left
	}
}

@media screen and (max-width:600px) and (max-device-height:667px) {
	.portfolio_title {
		margin-top: 50px
	}

	.owl-item img {
		height: 465px
	}

	#project-term {
		margin-bottom: 0;
		padding-top: 20px;
		text-align: center
	}

	.carousel_text {
		font-size: 20px
	}

	.we_are_hero {
		font-size: 24px;
		font-family: lato;
		font-weight: 800;
		text-transform: uppercase;
		line-height: 40px;
		top: 24%;
		left: 0
	}

	.we_are_hero_small {
		font-size: 36px
	}

	.banner_hero_main {
		height: 100vh;
		background-color: #2a2e31
	}

	#hero_myVideo {
		margin-top: 55%
	}

	.hero_service_main {
		position: relative;
		bottom: 0
	}

	.hero_service {
		margin-bottom: 10px;
		margin-top: 10px;
		background-color: #eeb013;
		margin-left: 30px;
		margin-right: 30px;
		padding: 5px;
		border-radius: 28px
	}

	.hero_service1 {
		margin-bottom: 20px;
		background-color: #eeb013;
		margin-left: 30px;
		margin-right: 30px;
		padding: 10px;
		border-radius: 28px
	}

	.hero_service a,
	.hero_service1 a {
		font-family: open sans;
		font-size: 22px;
		font-weight: 600;
		color: #212121;
		text-shadow: none
	}

	.iphone-x {
		display: none
	}

	.portfolio_title {
		font-size: 36px;
		color: #2a2e31;
		float: left;
		font-weight: 800;
		font-family: open sans;
		line-height: 44px
	}

	.l-left img {
		width: 100%
	}

	.slide {
		height: 470px
	}

	.avatars {
		top: 490px
	}

	.slide blockquote p {
		font-family: Baskerville;
		color: #fff;
		padding: 0;
		font-size: 26px;
		font-style: italic;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		max-width: 100%
	}

	.container-fluid.footerArea1 {
		padding-top: 20%;
		height: 100vh
	}

	.slide {
		top: 60px
	}

	.sld375 {
		display: block
	}

	.services_link {
		display: none
	}

	.blue_copyright p {
		padding-bottom: 0;
		font-size: 16px;
		float: left;
		margin-bottom: 0;
		margin: 0 auto;
		width: 78%
	}

	.ending_footer {
		min-height: 293px;
		background-position: 0 40px
	}

	.pad_bot_70 {
		padding-bottom: 17px
	}

	.container.ourwork {
		margin-top: 30px
	}
}

@media screen and (min-width:1366px) and (max-width:1600px) {
	.ourwork {
		padding-top: 100px
	}

	.our_skills {
		padding-top: 100px
	}
}

header {
	will-change: height;
	position: fixed;
	height: 72px;
	top: 0;
	left: 0;
	z-index: 999999;
	width: 100%;
	transition: all .3s ease;
	background-color: rgba(17, 20, 23, .85)
}

header.shrunk {
	height: 72px;
	background-color: rgba(17, 20, 23, .85);
}

@media screen and (max-width:678px) {

	.animation-element.slide-left.testimonial,
	.animation-element.slide-left.testimonial:nth-of-type(even),
	.animation-element.slide-left.testimonial:nth-of-type(odd) {
		width: 100%;
		margin: 0 0 20px 0
	}

	.animation-element.slide-left.testimonial .content,
	.animation-element.slide-left.testimonial .left,
	.animation-element.slide-left.testimonial .rating,
	.animation-element.slide-left.testimonial .right {
		text-align: center;
		float: none
	}

	.animation-element.slide-left.testimonial img {
		width: 85px;
		height: 85px;
		margin-bottom: 5px
	}
}

@media only screen and (min-width:1367px) and (max-width:1920px) {
	.testimonial_right {
		padding: 10% 5% 0 4%
	}

	.testimonial_text {
		padding-right: 0;
		padding-top: 14px
	}

	#testimonials_carousel {
		padding-bottom: 22px;
		padding-top: 76px !important
	}

	.ourwork {
		padding-top: 100px
	}
}

@media only screen and (min-width:1200px) and (max-width:1366px) {
	.testimonial_right {
		padding: 10% 5% 0 4%
	}

	.testimonial_text {
		padding-right: 140px;
		padding-top: 14px
	}

	.leftside img {
		width: 100%;
		height: auto
	}

	#testimonials_carousel {
		padding-bottom: 22px;
		padding-top: 76px !important
	}

	.ourwork {
		padding-top: 100px
	}

	.our_skills {
		padding-top: 100px
	}
}

@media only screen and (min-width:1025px) and (max-width:1199px) {
	.testimonial_right {
		padding: 69px 10px 0 50px
	}

	.testimonial_text {
		padding-right: 0;
		padding-top: 14px
	}

	.leftside img {
		width: 100%;
		height: auto
	}

	.container.ourwork {
		width: 100%
	}

	.ending_title {
		font-size: 130px
	}

	.ending_title3 {
		font-size: 130px
	}
}

@media only screen and (min-width:992px) and (max-width:1024px) {
	.testimonial_right {
		padding: 28px 10px 0 50px
	}

	.testimonial_text {
		padding-right: 0;
		padding-top: 14px
	}

	.leftside img {
		width: 100%;
		height: auto
	}

	.container.ourwork {
		width: 100%
	}

	.ending_title {
		font-size: 90px
	}

	.ending_title3 {
		font-size: 90px
	}

	.we_are_hero {
		font-size: 70px
	}

	.hero_service_main {
		padding: 0 70px
	}

	.ending_subtitle {
		font-size: 36px
	}
}

@media only screen and (min-width:768px) and (max-width:991px) {
	#hero_myVideo {
		height: auto !important
	}

	.banner_hero_main {
		height: auto !important
	}

	header {
		margin-top: 15px
	}

	.we_are_hero {
		font-size: 60px
	}

	.hero_service_main {
		padding: 0 52px
	}

	.hero_service a,
	.hero_service1 a {
		font-size: 15px
	}

	.carousel_main {
		padding-left: 50px
	}

	.portfolio_title {
		font-size: 36px;
		float: left;
		width: 100% !important;
		margin: 0;
		padding: 0
	}

	#project-terms {
		width: 75%;
		float: left;
		text-align: left;
		padding-top: 13px;
		margin-bottom: 30px
	}

	.carousel_text {
		font-size: 15px;
		padding: 4px 8px
	}

	.testimonial_right {
		padding: 20px 10px 0 38px
	}

	.testimonial_text {
		padding-right: 0;
		padding-top: 8px;
		font-size: 14px
	}

	.leftside img {
		width: 100%;
		height: auto
	}

	.container.ourwork {
		width: 100%
	}

	.ending_title {
		font-size: 50px
	}

	.ending_title3 {
		font-size: 50px
	}

	.ending_subtitle {
		font-size: 24px
	}

	.white_box_over {
		left: 0;
		top: 130px;
		width: 151px;
		height: 400px
	}

	.carousel_main {
		background-image: none !important;
		padding-bottom: 0 !important
	}

	.video_image {
		padding-bottom: 30px
	}

	.title {
		padding-top: 0
	}

	.services_title {
		font-size: 34px
	}

	.testimonial_right h4 {
		font-size: 20px;
		padding-top: 0 !important;
		margin-top: 0 !important
	}
}

@media only screen and (min-width:481px) and (max-width:767px) {
	.glyphicon-chevron-right:before {
		left: -35px !important
	}

	.white_box_over {
		display: none
	}

	.carousel_main {
		padding-left: 10px;
		padding-right: 10px
	}

	.portfolio_title {
		font-size: 36px;
		float: left;
		width: 100% !important;
		text-align: center;
		margin-top: -10px
	}

	#project-terms {
		width: 100%;
		float: left;
		text-align: center;
		padding-top: 0;
		margin-bottom: 25px
	}

	.carousel_text {
		font-size: 15px;
		padding: 4px 8px
	}

	.row.video_image img {
		width: 100%
	}

	.testimonial_right {
		margin-left: 0 !important;
		padding: 19px 36px 0 36px
	}

	span.testimonial_logo img {
		width: 25%
	}

	.testimonial_text {
		padding-right: 0;
		padding-top: 8px;
		font-size: 14px
	}

	.leftside img {
		width: 100%;
		height: auto
	}

	.container.ourwork {
		width: 100%
	}

	.ending_title {
		font-size: 36px
	}

	.ending_title3 {
		font-size: 36px
	}

	.ending_subtitle {
		font-size: 18px
	}

	.carousel_main {
		background-image: none !important;
		padding-bottom: 0 !important
	}

	.video_image {
		padding-bottom: 22px;
		padding-top: 25px
	}

	.title {
		padding-top: 0
	}

	.services_title {
		font-size: 36px
	}

	.testimonial_right h4 {
		font-size: 20px;
		padding-top: 0 !important;
		margin-top: 0 !important
	}

	.ending {
		padding-bottom: 0
	}

	#testimonials_carousel {
		padding-bottom: 22px
	}
}

@media only screen and (min-width:376px) and (max-width:480px) {
	.owl-item img {
		height: 300px
	}

	.glyphicon-chevron-right:before {
		left: -35px !important
	}

	.white_box_over {
		display: none
	}

	.carousel_main {
		padding-left: 10px;
		padding-right: 10px
	}

	.portfolio_title {
		font-size: 32px;
		float: left;
		width: 100% !important;
		text-align: center;
		margin-top: -10px
	}

	#project-terms {
		width: 100%;
		float: left;
		text-align: center;
		padding-top: 0;
		margin-bottom: 25px
	}

	.carousel_text {
		font-size: 14px;
		padding: 4px 8px
	}

	.row.video_image img {
		width: 100%
	}

	.testimonial_right {
		margin-left: 0 !important;
		padding: 19px 36px 0 36px
	}

	span.testimonial_logo img {
		width: 25%
	}

	.testimonial_text {
		padding-right: 0;
		padding-top: 8px;
		font-size: 14px
	}

	.leftside img {
		width: 100%;
		height: auto
	}

	.container.ourwork {
		width: 100%
	}

	.ending_title {
		font-size: 32px
	}

	.ending_title3 {
		font-size: 32px
	}

	.ending_subtitle {
		font-size: 18px
	}

	.carousel_main {
		background-image: none !important;
		padding-bottom: 0 !important;
		height: 300px
	}

	.video_image {
		padding-bottom: 22px;
		padding-top: 25px;
		height: auto
	}

	.title {
		padding-top: 0
	}

	.services_title {
		font-size: 32px
	}

	.testimonial_right h4 {
		font-size: 20px;
		padding-top: 0 !important;
		margin-top: 0 !important
	}

	.ending {
		padding-bottom: 0
	}

	#testimonials_carousel {
		padding-bottom: 22px
	}
}

@media only screen and (min-width:0px) and (max-width:375px) {
	.glyphicon-chevron-right:before {
		left: -35px !important
	}

	.white_box_over {
		display: none
	}

	.carousel_main {
		padding-left: 10px;
		padding-right: 10px
	}

	.portfolio_title {
		font-size: 28px;
		float: left;
		width: 100% !important;
		text-align: center;
		margin-top: -10px
	}

	#project-terms {
		width: 100%;
		float: left;
		text-align: center;
		padding-top: 0;
		margin-bottom: 25px
	}

	.carousel_text {
		font-size: 12px;
		padding: 4px 4px
	}

	.row.video_image img {
		width: 100%
	}

	.testimonial_right {
		margin-left: 0 !important;
		padding: 19px 36px 0 36px
	}

	span.testimonial_logo img {
		width: 25%
	}

	.testimonial_text {
		padding-right: 0;
		padding-top: 8px;
		font-size: 14px
	}

	.leftside img {
		width: 100%;
		height: auto
	}

	.container.ourwork {
		width: 100%
	}

	.ending_title {
		font-size: 28px
	}

	.ending_title3 {
		font-size: 28px
	}

	.ending_subtitle {
		font-size: 16px;
		padding: 0 5px
	}

	.carousel_main {
		background-image: none !important;
		padding-bottom: 0 !important;
		height: 300px
	}

	.owl-item img {
		height: 300px
	}

	.video_image {
		padding-bottom: 22px;
		padding-top: 25px;
		height: auto
	}

	.title {
		padding-top: 0
	}

	.services_title {
		font-size: 28px
	}

	.testimonial_right h4 {
		font-size: 20px;
		padding-top: 0 !important;
		margin-top: 0 !important
	}

	.ending {
		padding-bottom: 0
	}

	#testimonials_carousel {
		padding-bottom: 22px
	}

	.slidersection .demo-wrapper {
		padding: 0
	}
}

@media only screen and (min-device-width :375px) and (max-device-width :667px) {
	.l-left {
		padding-left: 0
	}

	.l-left img {
		width: 70%
	}

	.topnav {
		line-height: 30px !important
	}

	.fa-bars:before,
	.fa-navicon:before,
	.fa-reorder:before {
		font-size: 24px
	}
}

a:focus {
	outline: 0
}

.portfolioFilter {
	padding: 15px 0
}

.portfolioFilter a {
	font-size: 16px;
	color: #666;
	text-decoration: none;
	padding: 4px 15px;
	display: inline-block;
	font-family: lato;
	font-weight: 500
}

.portfolioFilter a.current {
	color: #df422b
}

.portfolioContainer {
	border: 1px solid #eee;
	border-radius: 3px
}

.port_img {
	overflow: hidden;
	width: 100%;
	background-color: #000
}

.port_img img {
	margin: 0;
	width: 100%;
	transition: 2s
}

.port_img img:hover {
	transform: scale(1.2);
	cursor: pointer;
	opacity: .1
}

.isotope-item {
	z-index: 2
}

.isotope-hidden.isotope-item {
	pointer-events: none;
	z-index: 1
}

.isotope,
.isotope .isotope-item {
	-webkit-transition-duration: .8s;
	-moz-transition-duration: .8s;
	transition-duration: .8s
}

.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	transition-property: height, width
}

.isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	transition-property: transform, opacity
}

.portfolio_title_main {
	padding-bottom: 20px
}

.portfolio_title {
	font-size: 44px;
	color: #6d6d6d;
	float: left;
	font-weight: 800;
	font-family: open sans
}

.portfolio_box {
	margin: 80px 0
}

.orange {
	color: #d82010
}

.our_work_ending_title {
	font-size: 18px;
	color: #fff;
	font-family: lato;
	font-weight: 500;
	padding-bottom: 50px
}

.our_work_ending_subtitle {
	font-size: 100px;
	color: #fff;
	font-family: lato;
	font-weight: 500
}

.our_work_ending_subtitle:hover {
	text-decoration: underline !important
}

.our_work_ending {
	background-color: #01083b;
	padding: 100px 0
}

.our_work_title {
	font-family: "Playfair Display", serif;
	font-size: 85px;
	font-weight: 600;
	color: #fff;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #fff070 0, #fff070 35%, #00c9d3 66%, #00c9d3 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite
}

@keyframes glow {
	0% {
		background-position: 0 43%
	}

	50% {
		background-position: 100% 58%
	}

	100% {
		background-position: 0 43%
	}
}

.our_work_para {
	font-family: lato;
	font-size: 14px;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #fff
}

.banner_our_work {
	position: relative;
	min-height: 650px;
	background-color: #000;
	padding: 180px 0 80px;
	background-image: linear-gradient(to top, #030729 20%, #01083b 80%)
}

.banner_our_work_main {
	position: relative
}

@keyframes move_wave {
	0% {
		transform: translateX(0) translateZ(0) scaleY(1)
	}

	50% {
		transform: translateX(-25%) translateZ(0) scaleY(.55)
	}

	100% {
		transform: translateX(-50%) translateZ(0) scaleY(1)
	}
}

.waveWrapper {
	overflow: hidden;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	margin: auto
}

.waveWrapperInner {
	position: absolute;
	width: 100%;
	overflow: hidden;
	height: 100%;
	bottom: -1px
}

.bgTop {
	z-index: 15;
	opacity: .5
}

.bgMiddle {
	z-index: 10;
	opacity: .75
}

.bgBottom {
	z-index: 5
}

.wave {
	position: absolute;
	left: 0;
	width: 200%;
	height: 100%;
	background-repeat: repeat no-repeat;
	background-position: 0 bottom;
	transform-origin: center bottom
}

.waveTop {
	background-size: 50% 100px
}

.waveAnimation .waveTop {
	animation: move-wave 3s;
	-webkit-animation: move-wave 3s;
	-webkit-animation-delay: 1s;
	animation-delay: 1s
}

.waveMiddle {
	background-size: 50% 120px
}

.waveAnimation .waveMiddle {
	animation: move_wave 10s linear infinite
}

.waveBottom {
	background-size: 50% 100px
}

.waveAnimation .waveBottom {
	animation: move_wave 15s linear infinite
}

.banner_contact_main {
	min-height: 650px;
	background-color: #fff
}

.banner_contact {
	padding-top: 220px;
	color: #fff;
	position: inherit;
	z-index: 1
}

.contact_title {
	font-family: lato;
	font-size: 55px;
	color: #fff;
	font-weight: 300
}

.contact_title_1 {
	font-family: lato;
	font-size: 24px;
	color: #fff;
	font-weight: 700;
	letter-spacing: 2px
}

.contact_subtitle {
	font-family: libre-baskerville;
	font-size: 60px;
	color: #fff;
	font-style: italic;
	font-weight: 700
}

.contact_subtitle:hover {
	font -family: libre-baskerville;
	font-size: 60px;
	color: #f7c115;
	font-style: italic;
	font-weight: 700;
	text-decoration: underline
}

.contact_details_main {
	background-color: #1d1d1d;
	min-height: 100px;
	transform-origin: left top;
	transform: skewy(-2deg)
}

.contact_details {
	background-color: #1d1d1d;
	padding: 50px 100px 100px;
	margin-top: -50px
}

.contact_sec2_title {
	color: #fff;
	font-size: 45px;
	font-family: clear sans;
	font-weight: 300
}

.contact_dark_grey {
	color: #fff;
	font-size: 18px;
	font-family: clear sans;
	font-weight: 400
}

.contact_light_grey {
	color: #d6d6d6;
	font-size: 18px;
	font-family: clear sans;
	font-weight: 300;
	line-height: 32px
}

.telephone h2 {
	margin-top: 0;
	padding-bottom: 30px
}

.contact_btn {
	color: #fff;
	background-color: #1d1d1d;
	padding: 11px 20px;
	border: 1px solid #343434;
	margin-top: 20px
}

.contact_map {
	margin-top: 80px;
	padding: 0 50px
}

.contact_ending {
	color: #fff;
	padding-top: 50px;
	padding-bottom: 80px;
	background-color: #111
}

.contact_ending_title {
	color: #fff;
	font-size: 150px;
	font-weight: 600
}

.contact_ending_subtitle {
	color: #b6b6b6;
	font-size: 40px;
	font-weight: 300
}

#hero_myVideo {
	background-color: #000;
	opacity: 1;
	object-fit: fill;
	height: 100vh;
	width: 100%
}

.hero_service {
	border-right: #fff solid 1px;
	text-align: center
}

.hero_service_main {
	position: absolute;
	bottom: 25px;
	padding: 0 150px;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	z-index: 99
}

.hero_service1 {
	text-align: center
}

.hero_service a,
.hero_service1 a {
	font-family: lato light;
	font-size: 16px;
	color: #fff;
	text-shadow: 0 0 20px #000;
	letter-spacing: 1.1px
}

.hero_service a:hover,
.hero_service1 a:hover {
	color: #fdc100
}

.hero_service a:focus,
.hero_service1 a:focus {
	color: #fdc100
}

.banner_hero_main {
	width: 100%;
	float: left;
	background-color: #000;
	height: 100vh
}

.hero_video {
	width: 100%;
	float: left;
	position: relative
}

.we_are_hero {
	font-family: OpenSans-Bold;
	letter-spacing: 3px;
	font-size: 80px;
	color: #fff !important;
	font-weight: bolder;
	line-height: 60 px !important;
	position: absolute;
	top: 25%;
	left: 5%;
	width: 30%;
	margin: 0 auto;
	text-shadow: 0 0 25px #131313;
	text-align: left
}

.uuu {
	color: #968e4e;
	position: absolute;
	top: 8px;
	z-index: 999999;
	font-size: 26px;
	font-weight: 600;
	left: 16px;
	font-family: initial
}

.we_are_hero_small {
	font-size: 70px
}

#project-terms {
	margin-bottom: 40px;
	padding-top: 20px;
	text-align: right
}

#project-term {
	margin-bottom: 40px;
	padding-top: 20px;
	text-align: right
}

div#project-terms a:active,
div#project-terms a:focus,
div#project-terms a:hover {
	color: #f7c115 !important
}

.carousel_main {
	background-repeat: no-repeat;
	background-position: 0 130px;
	position: relative;
	padding-bottom: 50px;
	padding-left: 150px;
	height: 100vh
}

.carousel_text {
	margin-right: 5%;
	font-size: 18px;
	color: #6d6d6d;
	text-decoration: none;
	padding: 4px 15px;
	display: inline-block;
	font-weight: 700;
	font-family: Montserrat, sans-serif;
	letter-spacing: .5px
}

.video_image {
	padding: 0
}

.white_box_over {
	background-image: url(../images/uifstechnologies/video_image_back.png);
	background-repeat: no-repeat;
	position: absolute;
	left: 0;
	top: 135px;
	width: 150px;
	height: 470px;
	z-index: 9;
	overflow: hidden;
	background-color: #fff
}

.ending_title {
	position: relative
}

.ending_title3 {
	color: #e5422b;
	font-size: 120px;
	font-weight: 600;
	position: relative;
	display: inline-block;
	transition: all 2s ease-in-out
}

.ending_title3:hover {
	cursor: pointer
}

#dd1,
#dd2,
#dd3,
#dd4,
#dd6,
#dd7,
#dd8 {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: absolute;
	top: 26px;
	left: -34px;
	background-color: #e5422b;
	transition: all 1s ease-in-out;
	transform: translate3d(0, 0, 0)
}

#dd5 {
	width: 28px;
	height: 28px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 50%;
	position: absolute;
	top: 22px;
	left: -36px;
	background-color: #e5422b;
	transition: all 1s ease-in-out;
	transform: translate3d(0, 0, 0);
	transition-delay: .5s;
	z-index: 9
}

.ending_title3:hover #dd1 {
	transform: translate(-50px, -30px);
	background-color: transparent;
	transition-delay: .1s
}

.ending_title3:hover #dd2 {
	transform: translate(20px, -50px);
	background-color: transparent;
	transition-delay: .3s
}

.ending_title3:hover #dd3 {
	transform: translate(-145px, 90px);
	background-color: transparent;
	transition-delay: .5s
}

.ending_title3:hover #dd4 {
	transform: translate(190px, 10px);
	background-color: transparent;
	transition-delay: .7s
}

.ending_title3:hover #dd6 {
	transform: translate(-155px, 75px);
	background-color: transparent;
	transition-delay: .9s
}

.ending_title3:hover #dd7 {
	transform: translate(134px, -72px);
	background-color: transparent;
	transition-delay: 1.1s
}

.ending_title3:hover #dd8 {
	transform: translate(175px, 37px);
	background-color: transparent;
	transition-delay: 1.3s
}

.ending_title3:hover #dd8 {
	transform: translate(205px, -137px);
	background-color: transparent;
	transition-delay: 1.5s
}

.ending_title3:hover #dd8 {
	transform: translate(92px, -52px);
	background-color: transparent;
	transition-delay: 1.6s
}

.ending_title3:hover #dd8 {
	transform: translate(-62px, -66px);
	background-color: transparent;
	transition-delay: 1.7s
}

.ending_title3:hover #dd5 {
	transform: translate(0, 0);
	background-color: #151759
}

.banner_about {
	background-image: url(../images/uifstechnologies/banner_about.jpg);
	background-repeat: no-repeat;
	min-height: 718px;
	background-color: #151759;
	transform: skewy(-4deg)
}

.banner_about_main {
	min-height: 718px;
	background-color: #151759;
	transform: skewy(4deg)
}

.floating {
	animation-name: floating;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	position: absolute;
	top: 150px;
	left: 110px;
	z-index: 998
}

@keyframes floating {
	from {
		transform: translate(0, 0)
	}

	65% {
		transform: translate(0, 15px)
	}

	to {
		transform: translate(0, 0)
	}
}

.video_about_main {
	background-image: url(../images/uifstechnologies/video_about.jpg);
	min-height: 650px;
	background-color: grey;
	transform: skewy(2deg)
}

.we_are {
	padding: 150px;
	margin: 0 150px;
	font-size: 95px;
	color: #fff;
	font-weight: bolder;
	line-height: 110px
}

.white_space {
	min-height: 50px;
	background-color: #fff;
	transform: skewy(-2deg);
	position: relative;
	top: -28px
}

.white_space_main {
	min-height: 50px;
	background-color: #fff;
	position: relative;
	top: -28px
}

.team_title {
	text-transform: uppercase;
	font-size: 120px;
	padding-left: 80px;
	padding-right: 1000px;
	padding-bottom: 80px
}

.stats {
	min-height: 400px
}

.stats_grey {
	padding-top: 150px;
	padding-bottom: 150px;
	vertical-align: middle;
	background-color: #e5422b
}

.stats_blue {
	padding-top: 150px;
	padding-bottom: 150px;
	vertical-align: middle;
	background-color: #151759
}

.stats_white {
	padding-top: 150px;
	padding-bottom: 150px;
	vertical-align: middle;
	background-color: #fff
}

.stats_title {
	color: #e5422b;
	font-size: 110px;
	font-weight: 600
}

.stats_title_grey {
	color: #fff;
	font-size: 110px;
	font-weight: 600
}

.stats_title_blue {
	color: #fff;
	font-size: 110px;
	font-weight: 600
}

.stats_subtitle {
	color: #3e3e3e;
	font-size: 30px;
	font-weight: 600
}

.stats_subtitle_white {
	color: #fff;
	font-size: 30px;
	font-weight: 600
}

.pad-left-150 {
	padding-left: 150px
}

.pad-top-100 {
	padding-top: 100px
}

.journey {
	padding: 50px
}

.journey_title {
	font-size: 80px;
	color: #31313a
}

.journey_subtitle {
	font-size: 18px;
	font-weight: 600;
	color: #31313a;
	padding: 0 5px
}

.ending {
	color: #fff;
	padding-top: 90px;
	padding-bottom: 30px
}

.ending_footer {
	color: #fff;
	padding-top: 90px;
	padding-bottom: 30px;
	background-color: #2a2e31;
	background-image: url(../images/111_back.jpg);
	background-position: 0 66px;
	min-height: 315px
}

.ending_title {
	color: #6d6d6d;
	font-size: 120px;
	font-weight: 600
}

.ending_title2 {
	color: #e5422b;
	font-size: 120px;
	font-weight: 600
}

.ending_subtitle {
	color: #6d6d6d;
	font-size: 40px;
	font-weight: 600;
	transition: .2s
}

.ending_subtitle:hover {
	color: #f7c115;
	font-size: 40px;
	font-weight: 600;
	transition: 1s;
	text-decoration: underline
}

#world {
	background: linear-gradient(#8ee4ae, #e9eba3);
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden
}

.header-img__link {
	margin-right: 40px
}

.header__img-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: no-repeat 50%;
	background-size: cover
}

.video {
	position: relative
}

.video.is-paused .video__overlay,
.video:hover .video__overlay {
	opacity: 1
}

.video.is-paused .video__icon:after {
	content: ""
}

.video--small {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center
}

.video__overlay {
	opacity: 0;
	transition: opacity .3s
}

.video__controls {
	transform: translate(-50%, -50%)
}

.video__button,
.video__controls,
.video__time {
	position: absolute;
	top: 50%;
	left: 50%
}

.video__button {
	white-space: nowrap;
	display: -ms-inline-flexbox;
	display: inline-flex;
	transform: translate(-50%, -50%)
}

.video__button:hover .video__icon {
	transform: translateY(-2px)
}

.video__button:hover .video__icon:after {
	color: #a1b0bf
}

.video__icon {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	position: relative;
	box-shadow: -16px 32px 32px rgba(0, 0, 0, .64);
	transition: transform .2s ease-in-out
}

.video__icon:after {
	content: "";
	color: #1a1c33;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 12px;
	transition: color .2s ease-in-out
}

@media only screen and (min-width:1440px) {
	.video__icon:after {
		font-size: 16px
	}
}

@media only screen and (min-width:720px) {
	.video__icon {
		width: 56px;
		height: 56px
	}
}

@media only screen and (min-width:1440px) {
	.video__icon {
		width: 72px;
		height: 72px
	}
}

.video__time {
	font-size: 18px;
	line-height: 35px;
	font-family: Geomanist;
	color: hsla(0, 0%, 100%, .64);
	transform: translate(-50%, 24px)
}

@media screen and (min-width:1440px) {
	.video__time {
		font-size: 23px;
		line-height: 44px
	}
}

@media only screen and (min-width:720px) {
	.video__time {
		transform: translate(-50%, 32px)
	}
}

@media only screen and (min-width:1440px) {
	.video__time {
		transform: translate(-50%, 48px)
	}
}

.news-img {
	width: calc(100% - 24px)
}

@media only screen and (min-width:720px) {
	.news-img {
		width: calc(100% - 64px)
	}
}

@media only screen and (min-width:1024px) {
	.news-img--large {
		width: calc(58.33333% + -10px)
	}
}

@media only screen and (min-width:1440px) {
	.news-img--large {
		width: calc(58.33333% + -16.66667px)
	}
}

@media only screen and (min-width:1024px) {
	.news-img--small {
		width: calc(100% - 56px)
	}
}

@media only screen and (min-width:1440px) {
	.news-img--small {
		width: calc(100% - 72px)
	}
}

.news-img__link {
	display: block;
	width: 100%;
	padding-bottom: 66.7%;
	overflow: hidden;
	background: no-repeat top;
	background-size: cover
}

.news-card {
	display: block;
	padding: 24px
}

@media only screen and (min-width:720px) {
	.news-card {
		padding-left: 56px
	}
}

@media only screen and (min-width:1024px) {
	.news-card {
		padding: 32px 24px 24px 80px
	}
}

@media only screen and (min-width:1440px) {
	.news-card {
		padding: 40px 24px 24px 112px
	}
}

@media only screen and (min-width:1024px) {
	.news-card--large {
		width: calc(50% + -12px);
		margin-right: auto;
		padding: 32px 24px 32px 110px;
		box-shadow: 16px 16px 32px rgba(0, 0, 0, .64);
		position: absolute;
		left: calc(50% + -12px);
		bottom: 0
	}
}

@media only screen and (min-width:1440px) {
	.news-card--large {
		width: calc(50% + -20px);
		padding: 40px 24px 40px 166px;
		left: calc(50% + -20px)
	}
}

.news-card__author {
	font-size: 19px;
	line-height: 24px;
	font-family: Grifo;
	color: #a1b0bf;
	margin-bottom: 16px
}

.news-card__title {
	margin-bottom: 8px
}

.news-card__intro {
	font-size: 18px;
	line-height: 35px;
	font-family: Geomanist;
	opacity: .64;
	margin-bottom: 16px
}

@media screen and (min-width:1440px) {
	.news-card__intro {
		font-size: 23px;
		line-height: 44px
	}
}

.contact-person {
	position: relative;
	width: 100%;
	z-index: 2;
	margin-bottom: 32px
}

@media only screen and (min-width:720px) {
	.contact-person {
		margin-bottom: 64px;
		width: calc(75% + -6px)
	}
}

@media only screen and (min-width:1024px) {
	.contact-person {
		margin-bottom: 0;
		width: calc(50% - 12px);
		padding: 24px 0 0
	}
}

@media only screen and (min-width:1440px) {
	.contact-person {
		width: calc(50% - 20px);
		padding: 40px 0 0
	}
}

.contact-person--right {
	margin-left: auto;
	margin-top: 64px;
	padding: 0 0 24px
}

@media only screen and (min-width:1440px) {
	.contact-person--right {
		margin-top: 80px;
		padding: 0 0 40px
	}
}

.contact-person__images {
	position: relative;
	z-index: 2;
	width: calc(66.66667% + -5.33333px);
	box-shadow: 16px 16px 24px rgba(0, 0, 0, .64)
}

@media only screen and (min-width:720px) {
	.contact-person__images {
		width: calc(44.44444% + -13.33333px)
	}
}

@media only screen and (min-width:1024px) {
	.contact-person__images {
		width: calc(50% + -12px)
	}
}

@media only screen and (min-width:1440px) {
	.contact-person__images {
		width: calc(50% + -20px)
	}
}

.contact-person__images:active .contact-person__img--2,
.contact-person__images:hover .contact-person__img--2 {
	opacity: 1
}

@media only screen and (min-width:720px) {
	.contact-person__images--right {
		margin-left: calc(55.55556% + 13.33333px);
		box-shadow: -16px 16px 24px rgba(0, 0, 0, .64)
	}
}

.contact-person__img-container {
	padding-bottom: 150%
}

.contact-person__img {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: 50% no-repeat;
	background-size: cover;
	transition: all .4s ease-in-out
}

.contact-person__img--2 {
	opacity: 0
}

.contact-person__info {
	background-color: #1a1c33;
	box-shadow: 16px 16px 32px rgba(0, 0, 0, .64);
	z-index: 1;
	position: relative;
	padding: 56px 24px 24px calc(16.66667% + 2.66667px);
	transform: translateY(-40px)
}

@media only screen and (min-width:720px) {
	.contact-person__info {
		width: calc(77.77778% + -5.33333px);
		margin-left: calc(22.22222% + 5.33333px);
		padding-top: 32px;
		padding-left: calc(22.22222% + 5.33333px);
		position: absolute;
		bottom: 0;
		transform: translateY(24px)
	}
}

@media only screen and (min-width:1024px) {
	.contact-person__info {
		width: calc(66.66667% + -8px);
		margin-left: calc(33.33333% + 8px);
		padding-left: calc(16.66667% + 4px);
		top: 0;
		bottom: auto;
		transform: translateY(0)
	}
}

@media only screen and (min-width:1440px) {
	.contact-person__info {
		width: calc(66.66667% + -13.33333px);
		margin-left: calc(33.33333% + 13.33333px);
		padding-left: calc(16.66667% + 6.66667px)
	}
}

@media only screen and (min-width:720px) {
	.contact-person__info--right {
		margin-left: 0;
		padding-top: 32px;
		padding-left: 24px;
		padding-right: calc(22.22222% + 5.33333px);
		box-shadow: -16px 16px 32px rgba(0, 0, 0, .64)
	}
}

@media only screen and (min-width:1024px) {
	.contact-person__info--right {
		bottom: 0;
		top: auto;
		padding-right: calc(16.66667% + 4px)
	}
}

@media only screen and (min-width:1440px) {
	.contact-person__info--right {
		padding-right: calc(16.66667% + 6.66667px)
	}
}

.contact-person__function {
	font-size: 19px;
	line-height: 24px;
	font-family: Grifo;
	color: #a1b0bf
}

.contact-person__name {
	font-size: 20px;
	line-height: 26px;
	font-family: Geomanist-Medium;
	margin: 12px 0 24px
}

@media screen and (min-width:720px) {
	.contact-person__name {
		font-size: 27px;
		line-height: 36px
	}
}

@media screen and (min-width:1440px) {
	.contact-person__name {
		font-size: 34px;
		line-height: 44px
	}
}

@media screen and (min-width:1600px) {
	.contact-person__name {
		font-size: 41px;
		line-height: 53px
	}
}

@media only screen and (min-width:1440px) {
	.contact-person__name {
		margin-bottom: 32px
	}
}

.contact-person__text {
	font-size: 18px;
	line-height: 35px;
	font-family: Geomanist;
	opacity: .64
}

@media screen and (min-width:1440px) {
	.contact-person__text {
		font-size: 23px;
		line-height: 44px
	}
}

@media only screen and (min-width:720px) {
	.contact-person__text--xs {
		display: none
	}
}

.contact-person__text--sm {
	display: none
}

@media only screen and (min-width:720px) {
	.contact-person__text--sm {
		display: block
	}
}

a.contact-person__text {
	text-decoration: underline;
	opacity: 1
}

a.contact-person__text:hover {
	opacity: .64;
	text-decoration: none
}

.portfolio-filters {
	font-size: 16px;
	line-height: 26px;
	font-family: Geomanist-Medium;
	overflow: hidden;
	box-shadow: 16px 16px 32px 0 rgba(0, 0, 0, .64);
	margin-top: 32px;
	position: relative;
	height: 74px;
	transition: all .3s;
	z-index: 5
}

@media screen and (min-width:1440px) {
	.portfolio-filters {
		font-size: 19px;
		line-height: 32px
	}
}

.portfolio-filters:after,
.portfolio-filters:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0
}

.portfolio-filters:before {
	height: 1px;
	width: 100%;
	background-image: linear-gradient(270deg, #fe2f4d, transparent);
	transition: width .3s
}

.portfolio-filters:after {
	bottom: 0;
	width: 1px;
	background-image: linear-gradient(180deg, #fe2f4d, transparent)
}

@media only screen and (min-width:720px) {
	.portfolio-filters {
		width: calc(83.33333% + -44px);
		height: auto !important;
		box-shadow: none !important;
		margin-top: 24px;
		overflow: visible
	}

	.portfolio-filters:after,
	.portfolio-filters:before {
		display: none
	}
}

@media only screen and (min-width:1024px) {
	.portfolio-filters {
		width: 100%;
		margin-top: 32px
	}
}

@media only screen and (min-width:1440px) {
	.portfolio-filters {
		margin-top: 40px
	}
}

.portfolio-filters.is-active {
	box-shadow: 16px 16px 32px 0 rgba(0, 0, 0, .64)
}

.portfolio-filters.is-active:before {
	width: 80px
}

.portfolio-filters__toggle {
	cursor: pointer;
	padding: 24px 16px;
	position: relative
}

.portfolio-filters__toggle:after {
	content: "";
	font-family: icon;
	position: absolute;
	transform: rotate(90deg);
	transition: transform .3s;
	right: 16px;
	color: #fff
}

@media only screen and (min-width:720px) {
	.portfolio-filters__toggle {
		display: none
	}
}

.portfolio-filters__toggle.is-active {
	color: #fff
}

.portfolio-filters__toggle.is-active:after {
	transform: rotate(-90deg)
}

.portfolio-filters__list {
	padding: 0 16px 24px
}

@media only screen and (min-width:720px) {
	.portfolio-filters__list {
		padding: 0
	}
}

@media only screen and (min-width:720px) {
	.usp-block__img--left {
		margin-right: 24px
	}
}

@media only screen and (min-width:1440px) {
	.usp-block__img--left {
		margin-right: 40px
	}
}

@media only screen and (min-width:720px) {
	.usp-block__img--right {
		margin-left: calc(8.33333% + 22px)
	}
}

@media only screen and (min-width:1440px) {
	.usp-block__img--right {
		margin-left: calc(8.33333% + 38px)
	}
}

.service-links {
	padding-bottom: 40px
}

@media only screen and (min-width:720px) {
	.service-links {
		display: -ms-flexbox;
		display: flex;
		-ms-flex-pack: justify;
		justify-content: space-between;
		padding-bottom: 56px
	}
}

@media only screen and (min-width:1024px) {
	.service-links {
		padding-bottom: 72px
	}
}

@media only screen and (min-width:1440px) {
	.service-links {
		padding-bottom: 96px
	}
}

@media only screen and (min-width:1600px) {
	.service-links {
		padding-bottom: 112px
	}
}

.service-link {
	width: 100%
}

@media only screen and (min-width:720px) {
	.service-link {
		width: calc(50% - 12px)
	}
}

@media only screen and (min-width:1440px) {
	.service-link {
		width: calc(50% - 20px)
	}
}

.service-link+.service-link {
	margin-top: 40px
}

@media only screen and (min-width:720px) {
	.service-link+.service-link {
		margin-top: 80px
	}
}

.service-link__img-container {
	margin-bottom: 24px;
	box-shadow: 16px 16px 32px rgba(0, 0, 0, .64);
	transition: transform .5s cubic-bezier(.75, 0, 0, 1), box-shadow .5s cubic-bezier(.75, 0, 0, 1)
}

.service-link__img-container:hover {
	transform: translateY(10px);
	box-shadow: 8px 8px 24px rgba(0, 0, 0, .64)
}

@media only screen and (min-width:720px) {
	.service-link__img-container {
		margin-bottom: 32px
	}
}

@media only screen and (min-width:1024px) {
	.service-link__img-container {
		width: calc(83.33333% + 4px)
	}
}

@media only screen and (min-width:1440px) {
	.service-link__img-container {
		margin-bottom: 40px;
		width: calc(83.33333% + 20px)
	}
}

.service-link__img-link {
	display: block;
	width: 100%;
	padding-bottom: 66.7%;
	overflow: hidden;
	background: no-repeat top;
	background-size: cover
}

@media only screen and (min-width:1024px) {
	.service-link__content {
		padding-left: calc(16.66667% + 8px)
	}
}

@media only screen and (min-width:1440px) {
	.service-link__content {
		padding-left: calc(16.66667% + 16px)
	}
}

.service-link__title {
	margin-bottom: 8px
}

.service-link__intro {
	font-size: 18px;
	line-height: 35px;
	font-family: Geomanist;
	opacity: .64;
	margin-bottom: 16px
}

@media screen and (min-width:1440px) {
	.service-link__intro {
		font-size: 23px;
		line-height: 44px
	}
}

.step-block__content {
	position: relative;
	padding-top: 32px
}

.step-block__content:after {
	content: "";
	display: inline-block;
	position: absolute;
	right: 0;
	top: 0;
	height: 56px;
	width: calc(50% + -36px);
	box-shadow: 28px -28px 32px 0 rgba(0, 0, 0, .32)
}

.slider__container {
	position: fixed;
	display: block;
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	-webkit-transition: -webkit-transform .5s ease-in-out;
	transition: -webkit-transform .5s ease-in-out;
	-o-transition: transform .5s ease-in-out;
	transition: transform .5s ease-in-out
}

.slider__page {
	position: relative;
	width: 100%;
	height: 100%
}

.slider__indicators {
	position: fixed;
	left: 18px;
	top: 50%;
	z-index: 2;
	margin: 0;
	padding: 0;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%)
}

.slider__indicator {
	display: block;
	width: 10px;
	height: 10px;
	margin: 10px 0;
	border-radius: 100px;
	background-color: #fff;
	cursor: default
}

.slider__indicator--active {
	opacity: .3
}

@media(min-width:1200px) and (max-width:1400px) {
	.promo-block .promo-text {
		padding-right: 20px
	}
}

@media(max-width:1600px) {
	.vertical-menu .container {
		width: 100%
	}
}

.vertical-menu .col-4 .portfolio-item {
	width: 33.3333%
}

@media(max-width:1200px) {
	.vertical-menu .header {
		width: 240px
	}

	.vertical-menu {
		padding-left: 240px
	}

	.vertical-menu .testimonial.style-1 .testi {
		width: 100%
	}

	.vertical-menu .col-4 .portfolio-item {
		width: 50%
	}
}

@media(min-width:992px) and (max-width:1199px) {
	.in-the-look li {
		width: 33.3333%
	}

	header {
		margin-top: 0px
	}

	.in-the-look li .inn-look {
		padding: 0 10px
	}

	.popurlar_product .over-item {
		padding-top: 40%
	}

	.popurlar_product .details-sec a {
		letter-spacing: 0
	}

	.small-r-items .btn {
		letter-spacing: 0
	}

	.small-r-items .media {
		width: 100%;
		float: left;
		padding-right: 15px;
		position: relative;
		z-index: 2;
		margin-bottom: 20px
	}

	.small-r-items h5 {
		width: 100%;
		margin-top: 30px;
		text-align: center
	}

	.small-r-items .item-img {
		width: 120px
	}

	.port-folio-row li .hover-port {
		padding-top: 10%
	}

	.furniture .items-fer li {
		width: 33.3333%
	}

	header .search-nav ul.dropdown {
		width: 100% !important
	}

	.header-style-2.header-style-3 .logo {
		margin: 20px 0;
		width: 100%;
		text-align: center
	}

	.header-style-2.header-style-3 nav {
		margin-top: 20px
	}

	.header-style-2.header-style-3 nav {
		width: 100%
	}

	.promo-block .promo-text {
		padding-right: 20px
	}

	.contact.style-2 .contact-right {
		padding-right: 15px;
		padding-left: 15px !important
	}
}

@media(min-width:768px) and (max-width:991px) {
	.in-the-look li {
		width: 50%
	}

	.popurlar_product .details-sec a {
		letter-spacing: 0
	}

	.popurlar_product li {
		width: 50%
	}

	.list-style li {
		width: 100%
	}

	.small-r-items .media {
		width: 50%;
		float: left;
		padding-right: 15px;
		position: relative;
		z-index: 2
	}

	.small-r-items h5 {
		width: 100%;
		margin-top: 30px;
		text-align: center
	}

	.small-r-items .item-img {
		width: 120px
	}

	.port-folio-row li {
		width: 50%
	}

	.furniture .items-fer li {
		width: 33.3333%
	}

	.header-style-2.header-style-3 .logo {
		margin: 20px 0;
		width: 100%;
		text-align: center
	}

	.header-style-2.header-style-3 nav {
		margin-top: 20px
	}

	.header-style-2.header-style-3 nav {
		width: 100%
	}

	.col-4 .portfolio-item {
		width: 50%
	}

	.testimonial .testi {
		width: 100%
	}

	.testimonial .flex-direction-nav {
		display: none
	}

	.promo-block .promo-text {
		padding-right: 20px
	}

	.process-style-3 li {
		width: 50%;
		margin-bottom: 60px
	}

	.process-style-3 li:before {
		top: 120%
	}

	.process-style-3 .icon:before {
		height: 20px
	}

	.contact.style-2 .contact-right {
		padding-right: 15px;
		padding-left: 15px !important
	}

	.services-mission .icon-box.ib-style-3 {
		display: inline-block;
		width: 100%
	}
}

@media(max-width:767px) {
	header.header-2 nav {
		padding-top: 0;
		text-align: left;
		background: #fff
	}

	.vertical-menu .header {
		width: 100%;
		position: relative;
		padding-top: 20px;
		margin-bottom: -5px
	}

	.vertical-menu .header .social-icons {
		display: none
	}

	.vertical-menu .header nav {
		margin-top: 10px
	}

	.vertical-menu {
		padding-left: 0
	}

	.collection-adds li {
		width: 50%;
		float: left;
		margin-bottom: 30px
	}

	.add_block_2 li {
		margin-bottom: 30px
	}

	.blog-posts .info {
		margin-bottom: 30px
	}

	p.intro-small {
		width: 100%
	}

	.subcribe h4 {
		width: 100%;
		margin-bottom: 20px
	}

	#contact_form li {
		margin-bottom: 10px
	}

	.our-clients p.intro {
		width: 100%
	}

	.services li .icon {
		margin-bottom: 10px
	}

	.services li {
		margin-bottom: 30px
	}

	.posts-list.list-style-1 .entry-body {
		padding: 20px
	}

	.welcome .icon-box.ib-style-1 {
		margin-bottom: 10px
	}

	.section-parthner ul {
		display: inline-block;
		width: 100%
	}

	.section-parthner ul li {
		width: 50%;
		float: left
	}

	header.coporate-header {
		background: #fff
	}

	header .is-sticky .sticky {
		padding: 0
	}

	header.coporate-header .is-sticky .sticky {
		position: relative !important
	}

	header.dark-text {
		background: rgba(255, 255, 255, .9)
	}

	.social-icons-large li {
		width: 25%;
		float: left
	}

	.team.style-6 ul li {
		width: 50%;
		float: left
	}

	.team.style-6 .team-image .social-icons {
		display: inline-block;
		width: 100%
	}

	.team.style-6 .team-image .social-icons li {
		width: auto;
		float: none;
		display: inline-block;
		margin-bottom: 0;
		display: inline-block;
		text-align: center
	}

	.process .process-style-2 li {
		width: 50%;
		margin-bottom: 30px
	}

	#cd-menu-trigger {
		left: 130px;
		top: 30px
	}
}

@media (max-width:640px) {
	.seasonals ul li {
		width: 100%
	}

	.construction .services-style-2 ul li {
		width: 100%;
		margin-top: 20px
	}

	.top-bar {
		height: auto
	}

	header .language {
		width: 100%;
		display: inline-block;
		text-align: left
	}

	.top-links {
		float: left;
		width: 100%;
		text-align: center
	}

	.top-links li {
		float: none;
		display: inline-block
	}

	.top-links ul {
		width: 100%
	}

	.top-links .social_icons {
		position: absolute;
		right: 0;
		top: 0;
		width: auto
	}

	.social-icons-large li {
		width: 50%;
		float: left;
		margin-bottom: 30px
	}
}

.let_us_help {
	padding: 70px 0;
	background-image: url(../images/uifstechnologies/let_us_help_back.jpg);
	background-repeat: no-repeat;
	background-position: top
}

.let_us_help_title {
	color: #312f2f;
	font-size: 42px;
	text-transform: uppercase
}

.red_color_text: {
	color: #e5422b
}

.small_text {
	color: #717274;
	font-size: 16px;
	font-weight: 300
}

.small_text_title {
	color: #312f2f;
	font-size: 16px;
	font-weight: 500
}

.learn_more {
	background-color: #e5422b;
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	border: 1px solid #e5422b;
	border-radius: 25px;
	padding: 15px 40px;
	margin-right: -10px
}

.contact_us {
	background-color: #fff;
	color: #6a6a6a;
	font-size: 16px;
	font-weight: 500;
	border: 1px solid #e9e9e9;
	border-radius: 25px;
	padding: 15px 40px;
	margin-left: -10px
}

.pad_tb_20 {
	padding: 20px 0
}

.ourservicesbox {
	display: contents;
	width: 100%;
	float: left;
	height: 100vh
}

.services_title {
	font-family: lato;
	color: #312f2f;
	font-size: 46px;
	font-weight: 900
}

.title {
	padding-bottom: 30px
}

.video_image {
	position: relative;
	padding: 0 0;
	height: 100vh
}

.video_image img {
	width: 100%
}

.play_btn_outer {
	position: absolute;
	top: calc(50% - 50px);
	left: calc(50% - 50px);
	width: 100px;
	height: 100px;
	box-shadow: 1px 1px 6px #a09898;
	border-radius: 50%;
	text-align: center;
	vertical-align: middle;
	line-height: 100px;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out
}

.play_btn_outer:hover {
	position: absolute;
	top: calc(50% - 40px);
	left: calc(50% - 40px);
	width: 80px;
	height: 80px;
	box-shadow: 1px 1px 6px #a09898;
	border-radius: 50%;
	text-align: center;
	vertical-align: middle;
	line-height: 100px
}

.play_btn {
	position: absolute;
	top: calc(50% - 40px);
	left: calc(50% - 40px);
	width: 80px;
	height: 80px;
	box-shadow: 1px 1px 6px #a09898;
	border-radius: 50%;
	text-align: center;
	vertical-align: middle;
	line-height: 80px;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out
}

.play_btn:hover {
	position: absolute;
	top: calc(50% - 50px);
	left: calc(50% - 50px);
	width: 100px;
	height: 100px;
	box-shadow: 1px 1px 6px #a09898;
	border-radius: 50%;
	text-align: center;
	vertical-align: middle;
	line-height: 100px;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out
}

.cd-img-replace {
	display: inline-block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap
}

.cd-main-content {
	position: relative;
	z-index: 2;
	-webkit-transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	transition-property: transform;
	-webkit-transition-duration: .4s;
	-moz-transition-duration: .4s;
	transition-duration: .4s
}

nav.navbar.navbar-inverse.mymenu {
	background-color: transparent !important;
	border-color: transparent !important;
	margin-bottom: 0
}

.menulist {
	float: right
}

.navbar-inverse.mymenu .navbar-nav>.active>a,
.navbar-inverse.mymenu .navbar-nav>.active>a:focus,
.navbar-inverse.mymenu .navbar-nav>.active>a:hover {
	color: #fff !important;
	border-bottom: 2px solid #eeb013 !important;
	border-color: transparent !important;
	background-color: transparent !important
}

.navbar-inverse.mymenu .navbar-nav>li {
	padding: 0 15px
}

.navbar-inverse.mymenu .navbar-nav>li>a {
	padding: 16px 0;
	padding-bottom: 24px;
	margin: 0;
	margin-top: 1px;
	border-color: transparent;
	text-decoration: none;
	line-height: 20px;
	text-transform: uppercase;
	color: #fff;
	letter-spacing: 2px;
	float: left;
	font-size: 13px;
	font-weight: 400;
	position: relative;
	border-bottom: 2px solid #fff;
	border-color: transparent
}

.dropdown,
.dropup {
	position: relative
}

.dropdown-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 1000;
	display: none;
	float: left;
	min-width: 160px;
	padding: 5px 0;
	margin: 2px 0 0;
	font-size: 14px;
	text-align: left;
	list-style: none;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, .15);
	border-radius: 4px;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
	box-shadow: 0 6px 12px rgba(0, 0, 0, .175)
}

ul.dropdown-menu {
	padding-bottom: 0;
	background: #141414;
	padding: 20px 35px
}

ul.dropdown-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	padding-top: 20px;
	padding-bottom: 20px;
	z-index: 99;
	width: 250px !important;
	display: none !important
}

ul.dropdown-menu li {
	list-style: none;
	margin: 0;
	padding: 0;
	z-index: 99;
	width: 250px !important;
	padding-right: 35px;
	float: left
}

ul.dropdown-menu li a {
	text-transform: uppercase;
	border: none !important;
	line-height: 20px;
	background: 0 0;
	color: #dadada !important;
	font-size: 13px;
	display: inline-block;
	width: 100%;
	font-weight: 400;
	letter-spacing: 0;
	padding-right: 0;
	text-align: left;
	padding: 7px 0;
	white-space: unset
}

.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
	background: 0 0 !important;
	color: #e4a913 !important
}

.menulist {
	padding: 0
}

.glyphicon-chevron-right:before {
	content: "\f105" !important;
	font-family: FontAwesome !important;
	font-size: 49px !important;
	color: #fff !important;
	left: 17px !important;
	top: -9px !important;
	right: 0;
	position: absolute !important
}

.glyphicon-chevron-left:before {
	content: "\f104" !important;
	font-family: FontAwesome !important;
	font-size: 49px !important;
	color: #fff !important;
	left: 17px !important;
	top: -9px !important;
	right: 0;
	position: absolute !important
}

.carousel-control.left {
	background-image: unset !important
}

.carousel-control.right {
	background-image: unset !important
}

h1.services_title {
	margin-top: 0 !important
}

h1.ending_title {
	margin-top: 0 !important
}

@media only screen and (min-width:768px) {
	header li.dropdown:hover .dropdown-menu {
		display: block !important
	}
}

.container-fluid.footerArea {
	background: #021041;
	padding-bottom: 25px;
	padding-top: 25px
}

#footer .block-title {
	color: #fff;
	font-size: 18px;
	letter-spacing: 1px;
	padding-top: 30px;
	margin-bottom: 25px;
	padding-bottom: 10px;
	position: relative;
	width: 100%;
	text-transform: uppercase;
	float: left;
	font-weight: 500
}

#footer .block-title span {
	position: relative
}

#footer .block-title span:after {
	background: #fbe105 !important;
	bottom: -10px;
	left: 0;
	content: "";
	height: 1px;
	position: absolute;
	width: 53px
}

.block-content {
	width: 100%;
	float: left
}

.block-content li {
	list-style: none;
	padding-bottom: 20px;
	font-family: lato;
	font-size: 14px;
	font-weight: 300;
	color: #fff
}

.block-content li a {
	color: #fff;
	transition: .7s;
	font-size: 14px;
	font-family: Lato;
	font-weight: 300
}

.block-content a:focus,
.block-content a:hover {
	color: #33b5e5 !important;
	text-decoration: none
}

.copyright p {
	width: 100%;
	float: left;
	text-align: center;
	margin: 13px;
	color: #434444;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 1px
}

.pad_bot_50 {
	padding-bottom: 50px
}

.pad_bot_70 {
	padding-bottom: 70px
}

.home_footer_ucodice_text {
	float: left;
	text-align: left;
	color: #fff;
	font-family: lato;
	font-weight: 700;
	font-size: 20px
}

.underline_text {
	font-weight: 400;
	font-size: 17px;
	color: #fff;
	text-decoration: underline;
	transition: 1s
}

.underline_text:hover {
	color: #33b5e5
}

.let_work {
	text-align: center;
	color: #fff;
	font-size: 40px;
	padding-bottom: 25px;
	font-size: 16px !important;
	color: #fff !important;
	margin-top: 30px !important;
	border-bottom: 1px solid #282a2b;
	padding-bottom: 20px
}

.blue_copyright p {
	text-align: center;
	color: #fff;
	font-weight: 400;
	font-size: 15px;
	padding-bottom: 0;
	float: initial;
	margin-bottom: 0;
	padding: 14px;
	background-color: #161617
}

.container-fluid.footerArea2 {
	background: #1f2021;
	padding-bottom: 30px;
	padding-left: 70px;
	background-repeat: no-repeat;
	background-position: center top;
	background-position: left -40px;
	background-image: url(../images/footer_background.jpg);
	background-repeat: repeat
}

.copyright p {
	width: 100%;
	float: left;
	text-align: center;
	margin: 13px;
	color: #434444;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 1px
}

.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
	background: 0 0;
	color: #e4a913 !important
}

.dark_blue {
	background-color: #161717 !important
}

.top_strip {
	background-color: #000;
	width: 100%;
	height: 80px
}

svg {
	max-width: 100%
}

[data-theme] {
	background-color: #fff;
	background-color: var(--color-bg, #fff);
	color: #303035;
	color: var(--color-contrast-high, #313135)
}

:root {
	--space-unit: 1em;
	--space-xxxxs: calc(0.125*var(--space-unit));
	--space-xxxs: calc(0.25*var(--space-unit));
	--space-xxs: calc(0.375*var(--space-unit));
	--space-xs: calc(0.5*var(--space-unit));
	--space-sm: calc(0.75*var(--space-unit));
	--space-md: calc(1.25*var(--space-unit));
	--space-lg: calc(2*var(--space-unit));
	--space-xl: calc(3.25*var(--space-unit));
	--space-xxl: calc(5.25*var(--space-unit));
	--space-xxxl: calc(8.5*var(--space-unit));
	--space-xxxxl: calc(13.75*var(--space-unit));
	--component-padding: var(--space-md)
}

:root {
	--max-width-xxs: 32rem;
	--max-width-xs: 38rem;
	--max-width-sm: 48rem;
	--max-width-md: 64rem;
	--max-width-lg: 80rem;
	--max-width-xl: 90rem;
	--max-width-xxl: 120rem
}

:root {
	--radius-sm: calc(var(--radius,
				0.25em)/2);
	--radius-md: var(--radius,
			0.25em);
	--radius-lg: calc(var(--radius,
				0.25em)*2);
	--shadow-sm: 0 1px 2px rgba(0,
			0,
			0,
			.085), 0 1px 8px rgba(0,
			0,
			0,
			.1);
	--shadow-md: 0 1px 8px rgba(0,
			0,
			0,
			.1), 0 8px 24px rgba(0,
			0,
			0,
			.15);
	--shadow-lg: 0 1px 8px rgba(0,
			0,
			0,
			.1), 0 16px 48px rgba(0,
			0,
			0,
			.1), 0 24px 60px rgba(0,
			0,
			0,
			.1);
	--bounce: cubic-bezier(0.175,
			0.885,
			0.32,
			1.275);
	--ease-in-out: cubic-bezier(0.645,
			0.045,
			0.355,
			1);
	--ease-in: cubic-bezier(0.55,
			0.055,
			0.675,
			0.19);
	--ease-out: cubic-bezier(0.215,
			0.61,
			0.355,
			1)
}

.icon {
	display: inline-block;
	color: inherit;
	fill: currentColor;
	height: 1em;
	width: 1em;
	line-height: 1;
	-ms-flex-negative: 0;
	flex-shrink: 0
}

.icon--xxs {
	font-size: 12px;
	font-size: var(--icon-xxs)
}

.icon--xs {
	font-size: 16px;
	font-size: var(--icon-xs)
}

.icon--sm {
	font-size: 24px;
	font-size: var(--icon-sm)
}

.icon--md {
	font-size: 32px;
	font-size: var(--icon-md)
}

.icon--lg {
	font-size: 48px;
	font-size: var(--icon-lg)
}

.icon--xl {
	font-size: 64px;
	font-size: var(--icon-xl)
}

.icon--xxl {
	font-size: 128px;
	font-size: var(--icon-xxl)
}

.icon--is-spinning {
	-webkit-animation: icon-spin 1s infinite linear;
	animation: icon-spin 1s infinite linear
}

@-webkit-keyframes icon-spin {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg)
	}
}

@keyframes icon-spin {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg)
	}
}

.icon use {
	color: inherit;
	fill: currentColor
}

@media not all and (min-width:32rem) {
	.display\@xs {
		display: none !important
	}
}

@media (min-width:32rem) {
	.hide\@xs {
		display: none !important
	}
}

@media not all and (min-width:48rem) {
	.display\@sm {
		display: none !important
	}
}

@media (min-width:48rem) {
	.hide\@sm {
		display: none !important
	}
}

@media not all and (min-width:64rem) {
	.display\@md {
		display: none !important
	}
}

@media (min-width:64rem) {
	.hide\@md {
		display: none !important
	}
}

@media not all and (min-width:80rem) {
	.display\@lg {
		display: none !important
	}
}

@media (min-width:80rem) {
	.hide\@lg {
		display: none !important
	}
}

@media not all and (min-width:90rem) {
	.display\@xl {
		display: none !important
	}
}

@media (min-width:90rem) {
	.hide\@xl {
		display: none !important
	}
}

:root {
	--display: block
}

.is-visible {
	display: block !important;
	display: var(--display) !important
}

.is-hidden {
	display: none !important
}

.sr-only {
	position: absolute;
	clip: rect(1px, 1px, 1px, 1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	overflow: hidden;
	padding: 0;
	border: 0;
	white-space: nowrap
}

.flex {
	display: -ms-flexbox;
	display: flex
}

.inline-flex {
	display: -ms-inline-flexbox;
	display: inline-flex
}

.flex-wrap {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}

.flex-column {
	-ms-flex-direction: column;
	flex-direction: column
}

.flex-row {
	-ms-flex-direction: row;
	flex-direction: row
}

.flex-center {
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center
}

@media (min-width:32rem) {
	.flex-wrap\@xs {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap
	}

	.flex-column\@xs {
		-ms-flex-direction: column;
		flex-direction: column
	}

	.flex-row\@xs {
		-ms-flex-direction: row;
		flex-direction: row
	}

	.flex-center\@xs {
		-ms-flex-pack: center;
		justify-content: center;
		-ms-flex-align: center;
		align-items: center
	}

	.justify-start\@xs {
		-ms-flex-pack: start;
		justify-content: flex-start
	}

	.justify-end\@xs {
		-ms-flex-pack: end;
		justify-content: flex-end
	}

	.justify-center\@xs {
		-ms-flex-pack: center;
		justify-content: center
	}

	.justify-between\@xs {
		-ms-flex-pack: justify;
		justify-content: space-between
	}

	.items-center\@xs {
		-ms-flex-align: center;
		align-items: center
	}

	.items-start\@xs {
		-ms-flex-align: start;
		align-items: flex-start
	}

	.items-end\@xs {
		-ms-flex-align: end;
		align-items: flex-end
	}
}

@media (min-width:48rem) {
	.flex-wrap\@sm {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap
	}

	.flex-column\@sm {
		-ms-flex-direction: column;
		flex-direction: column
	}

	.flex-row\@sm {
		-ms-flex-direction: row;
		flex-direction: row
	}

	.flex-center\@sm {
		-ms-flex-pack: center;
		justify-content: center;
		-ms-flex-align: center;
		align-items: center
	}

	.justify-start\@sm {
		-ms-flex-pack: start;
		justify-content: flex-start
	}

	.justify-end\@sm {
		-ms-flex-pack: end;
		justify-content: flex-end
	}

	.justify-center\@sm {
		-ms-flex-pack: center;
		justify-content: center
	}

	.justify-between\@sm {
		-ms-flex-pack: justify;
		justify-content: space-between
	}

	.items-center\@sm {
		-ms-flex-align: center;
		align-items: center
	}

	.items-start\@sm {
		-ms-flex-align: start;
		align-items: flex-start
	}

	.items-end\@sm {
		-ms-flex-align: end;
		align-items: flex-end
	}
}

@media (min-width:64rem) {
	.flex-wrap\@md {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap
	}

	.flex-column\@md {
		-ms-flex-direction: column;
		flex-direction: column
	}

	.flex-row\@md {
		-ms-flex-direction: row;
		flex-direction: row
	}

	.flex-center\@md {
		-ms-flex-pack: center;
		justify-content: center;
		-ms-flex-align: center;
		align-items: center
	}

	.justify-start\@md {
		-ms-flex-pack: start;
		justify-content: flex-start
	}

	.justify-end\@md {
		-ms-flex-pack: end;
		justify-content: flex-end
	}

	.justify-center\@md {
		-ms-flex-pack: center;
		justify-content: center
	}

	.justify-between\@md {
		-ms-flex-pack: justify;
		justify-content: space-between
	}

	.items-center\@md {
		-ms-flex-align: center;
		align-items: center
	}

	.items-start\@md {
		-ms-flex-align: start;
		align-items: flex-start
	}

	.items-end\@md {
		-ms-flex-align: end;
		align-items: flex-end
	}
}

@media (min-width:80rem) {
	.flex-wrap\@lg {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap
	}

	.flex-column\@lg {
		-ms-flex-direction: column;
		flex-direction: column
	}

	.flex-row\@lg {
		-ms-flex-direction: row;
		flex-direction: row
	}

	.flex-center\@lg {
		-ms-flex-pack: center;
		justify-content: center;
		-ms-flex-align: center;
		align-items: center
	}

	.justify-start\@lg {
		-ms-flex-pack: start;
		justify-content: flex-start
	}

	.justify-end\@lg {
		-ms-flex-pack: end;
		justify-content: flex-end
	}

	.justify-center\@lg {
		-ms-flex-pack: center;
		justify-content: center
	}

	.justify-between\@lg {
		-ms-flex-pack: justify;
		justify-content: space-between
	}

	.items-center\@lg {
		-ms-flex-align: center;
		align-items: center
	}

	.items-start\@lg {
		-ms-flex-align: start;
		align-items: flex-start
	}

	.items-end\@lg {
		-ms-flex-align: end;
		align-items: flex-end
	}
}

@media (min-width:90rem) {
	.flex-wrap\@xl {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap
	}

	.flex-column\@xl {
		-ms-flex-direction: column;
		flex-direction: column
	}

	.flex-row\@xl {
		-ms-flex-direction: row;
		flex-direction: row
	}

	.flex-center\@xl {
		-ms-flex-pack: center;
		justify-content: center;
		-ms-flex-align: center;
		align-items: center
	}

	.justify-start\@xl {
		-ms-flex-pack: start;
		justify-content: flex-start
	}

	.justify-end\@xl {
		-ms-flex-pack: end;
		justify-content: flex-end
	}

	.justify-center\@xl {
		-ms-flex-pack: center;
		justify-content: center
	}

	.justify-between\@xl {
		-ms-flex-pack: justify;
		justify-content: space-between
	}

	.items-center\@xl {
		-ms-flex-align: center;
		align-items: center
	}

	.items-start\@xl {
		-ms-flex-align: start;
		align-items: flex-start
	}

	.items-end\@xl {
		-ms-flex-align: end;
		align-items: flex-end
	}
}

.flex-grow {
	-ms-flex-positive: 1;
	flex-grow: 1
}

.flex-shrink-0 {
	-ms-flex-negative: 0;
	flex-shrink: 0
}

.flex-gap-xxxs {
	margin-bottom: -.25em;
	margin-bottom: calc(-1*var(--space-xxxs));
	margin-right: -.25em;
	margin-right: calc(-1*var(--space-xxxs))
}

.flex-gap-xxxs>* {
	margin-bottom: .25em;
	margin-bottom: var(--space-xxxs);
	margin-right: .25em;
	margin-right: var(--space-xxxs)
}

.flex-gap-xxs {
	margin-bottom: -.375em;
	margin-bottom: calc(-1*var(--space-xxs));
	margin-right: -.375em;
	margin-right: calc(-1*var(--space-xxs))
}

.flex-gap-xxs>* {
	margin-bottom: .375em;
	margin-bottom: var(--space-xxs);
	margin-right: .375em;
	margin-right: var(--space-xxs)
}

.flex-gap-xs {
	margin-bottom: -.5em;
	margin-bottom: calc(-1*var(--space-xs));
	margin-right: -.5em;
	margin-right: calc(-1*var(--space-xs))
}

.flex-gap-xs>* {
	margin-bottom: .5em;
	margin-bottom: var(--space-xs);
	margin-right: .5em;
	margin-right: var(--space-xs)
}

.flex-gap-sm {
	margin-bottom: -.75em;
	margin-bottom: calc(-1*var(--space-sm));
	margin-right: -.75em;
	margin-right: calc(-1*var(--space-sm))
}

.flex-gap-sm>* {
	margin-bottom: .75em;
	margin-bottom: var(--space-sm);
	margin-right: .75em;
	margin-right: var(--space-sm)
}

.flex-gap-md {
	margin-bottom: -1.25em;
	margin-bottom: calc(-1*var(--space-md));
	margin-right: -1.25em;
	margin-right: calc(-1*var(--space-md))
}

.flex-gap-md>* {
	margin-bottom: 1.25em;
	margin-bottom: var(--space-md);
	margin-right: 1.25em;
	margin-right: var(--space-md)
}

.flex-gap-lg {
	margin-bottom: -2em;
	margin-bottom: calc(-1*var(--space-lg));
	margin-right: -2em;
	margin-right: calc(-1*var(--space-lg))
}

.flex-gap-lg>* {
	margin-bottom: 2em;
	margin-bottom: var(--space-lg);
	margin-right: 2em;
	margin-right: var(--space-lg)
}

.flex-gap-xl {
	margin-bottom: -3.25em;
	margin-bottom: calc(-1*var(--space-xl));
	margin-right: -3.25em;
	margin-right: calc(-1*var(--space-xl))
}

.flex-gap-xl>* {
	margin-bottom: 3.25em;
	margin-bottom: var(--space-xl);
	margin-right: 3.25em;
	margin-right: var(--space-xl)
}

.flex-gap-xxl {
	margin-bottom: -5.25em;
	margin-bottom: calc(-1*var(--space-xxl));
	margin-right: -5.25em;
	margin-right: calc(-1*var(--space-xxl))
}

.flex-gap-xxl>* {
	margin-bottom: 5.25em;
	margin-bottom: var(--space-xxl);
	margin-right: 5.25em;
	margin-right: var(--space-xxl)
}

.margin-xxxxs {
	margin: .125em;
	margin: var(--space-xxxxs)
}

.margin-xxxs {
	margin: .25em;
	margin: var(--space-xxxs)
}

.margin-xxs {
	margin: .375em;
	margin: var(--space-xxs)
}

.margin-xs {
	margin: .5em;
	margin: var(--space-xs)
}

.margin-sm {
	margin: .75em;
	margin: var(--space-sm)
}

.margin-md {
	margin: 1.25em;
	margin: var(--space-md)
}

.margin-lg {
	margin: 2em;
	margin: var(--space-lg)
}

.margin-xl {
	margin: 3.25em;
	margin: var(--space-xl)
}

.margin-xxl {
	margin: 5.25em;
	margin: var(--space-xxl)
}

.margin-xxxl {
	margin: 8.5em;
	margin: var(--space-xxxl)
}

.margin-xxxxl {
	margin: 13.75em;
	margin: var(--space-xxxxl)
}

.margin-auto {
	margin: auto
}

.margin-top-xxxxs {
	margin-top: .125em;
	margin-top: var(--space-xxxxs)
}

.margin-top-xxxs {
	margin-top: .25em;
	margin-top: var(--space-xxxs)
}

.margin-top-xxs {
	margin-top: .375em;
	margin-top: var(--space-xxs)
}

.margin-top-xs {
	margin-top: .5em;
	margin-top: var(--space-xs)
}

.margin-top-sm {
	margin-top: .75em;
	margin-top: var(--space-sm)
}

.margin-top-md {
	margin-top: 1.25em;
	margin-top: var(--space-md)
}

.margin-top-lg {
	margin-top: 2em;
	margin-top: var(--space-lg)
}

.margin-top-xl {
	margin-top: 3.25em;
	margin-top: var(--space-xl)
}

.margin-top-xxl {
	margin-top: 5.25em;
	margin-top: var(--space-xxl)
}

.margin-top-xxxl {
	margin-top: 8.5em;
	margin-top: var(--space-xxxl)
}

.margin-top-xxxxl {
	margin-top: 13.75em;
	margin-top: var(--space-xxxxl)
}

.margin-top-auto {
	margin-top: auto
}

.margin-bottom-xxxxs {
	margin-bottom: .125em;
	margin-bottom: var(--space-xxxxs)
}

.margin-bottom-xxxs {
	margin-bottom: .25em;
	margin-bottom: var(--space-xxxs)
}

.margin-bottom-xxs {
	margin-bottom: .375em;
	margin-bottom: var(--space-xxs)
}

.margin-bottom-xs {
	margin-bottom: .5em;
	margin-bottom: var(--space-xs)
}

.margin-bottom-sm {
	margin-bottom: .75em;
	margin-bottom: var(--space-sm)
}

.margin-bottom-md {
	margin-bottom: 1.25em;
	margin-bottom: var(--space-md)
}

.margin-bottom-lg {
	margin-bottom: 2em;
	margin-bottom: var(--space-lg)
}

.margin-bottom-xl {
	margin-bottom: 3.25em;
	margin-bottom: var(--space-xl)
}

.margin-bottom-xxl {
	margin-bottom: 5.25em;
	margin-bottom: var(--space-xxl)
}

.margin-bottom-xxxl {
	margin-bottom: 8.5em;
	margin-bottom: var(--space-xxxl)
}

.margin-bottom-xxxxl {
	margin- bottom: 13.75em;
	margin-bottom: var(--space-xxxxl)
}

.margin-bottom-auto {
	margin-bottom: auto
}

.margin-right-xxxxs {
	margin-right: .125em;
	margin-right: var(--space-xxxxs)
}

.margin-right-xxxs {
	margin-right: .25em;
	margin-right: var(--space-xxxs)
}

.margin-right-xxs {
	margin-right: .375em;
	margin-right: var(--space-xxs)
}

.margin-right-xs {
	margin-right: .5em;
	margin-right: var(--space-xs)
}

.margin-right-sm {
	margin-right: .75em;
	margin-right: var(--space-sm)
}

.margin-right-md {
	margin-right: 1.25em;
	margin-right: var(--space-md)
}

.margin-right-lg {
	margin-right: 2em;
	margin-right: var(--space-lg)
}

.margin-right-xl {
	margin-right: 3.25em;
	margin-right: var(--space-xl)
}

.margin-right-xxl {
	margin-right: 5.25em;
	margin-right: var(--space-xxl)
}

.margin-right-xxxl {
	margin-right: 8.5em;
	margin-right: var(--space-xxxl)
}

.margin-right-xxxxl {
	margin-right: 13.75em;
	margin-right: var(--space-xxxxl)
}

.margin-right-auto {
	margin-right: auto
}

.margin-left-xxxxs {
	margin-left: .125em;
	margin-left: var(--space-xxxxs)
}

.margin-left-xxxs {
	margin-left: .25em;
	margin-left: var(--space-xxxs)
}

.margin-left-xxs {
	margin-left: .375em;
	margin-left: var(--space-xxs)
}

.margin-left-xs {
	margin-left: .5em;
	margin-left: var(--space-xs)
}

.margin-left-sm {
	margin-left: .75em;
	margin-left: var(--space-sm)
}

.margin-left-md {
	margin-left: 1.25em;
	margin-left: var(--space-md)
}

.margin-left-lg {
	margin-left: 2em;
	margin-left: var(--space-lg)
}

.margin-left-xl {
	margin-left: 3.25em;
	margin-left: var(--space-xl)
}

.margin-left-xxl {
	margin-left: 5.25em;
	margin-left: var(--space-xxl)
}

.margin-left-xxxl {
	margin-left: 8.5em;
	margin-left: var(--space-xxxl)
}

.margin-left-xxxxl {
	margin-left: 13.75em;
	margin-left: var(--space-xxxxl)
}

.margin-left-auto {
	margin-left: auto
}

.margin-x-xxxxs {
	margin-left: .125em;
	margin-left: var(--space-xxxxs);
	margin-right: .125em;
	margin-right: var(--space-xxxxs)
}

.margin-x-xxxs {
	margin-left: .25em;
	margin-left: var(--space-xxxs);
	margin-right: .25em;
	margin-right: var(--space-xxxs)
}

.margin-x-xxs {
	margin-left: .375em;
	margin-left: var(--space-xxs);
	margin-right: .375em;
	margin-right: var(--space-xxs)
}

.margin-x-xs {
	margin-left: .5em;
	margin-left: var(--space-xs);
	margin-right: .5em;
	margin-right: var(--space-xs)
}

.margin-x-sm {
	margin-left: .75em;
	margin-left: var(--space-sm);
	margin-right: .75em;
	margin-right: var(--space-sm)
}

.margin-x-md {
	margin-left: 1.25em;
	margin-left: var(--space-md);
	margin-right: 1.25em;
	margin-right: var(--space-md)
}

.margin-x-lg {
	margin-left: 2em;
	margin-left: var(--space-lg);
	margin-right: 2em;
	margin-right: var(--space-lg)
}

.margin-x-xl {
	margin-left: 3.25em;
	margin-left: var(--space-xl);
	margin-right: 3.25em;
	margin-right: var(--space-xl)
}

.margin-x-xxl {
	margin-left: 5.25em;
	margin-left: var(--space-xxl);
	margin-right: 5.25em;
	margin-right: var(--space-xxl)
}

.margin-x-xxxl {
	margin-left: 8.5em;
	margin-left: var(--space-xxxl);
	margin-right: 8.5em;
	margin-right: var(--space-xxxl)
}

.margin-x-xxxxl {
	margin-left: 13.75em;
	margin-left: var(--space-xxxxl);
	margin-right: 13.75em;
	margin-right: var(--space-xxxxl)
}

.margin-x-auto {
	margin-left: auto;
	margin-right: auto
}

.margin-y-xxxxs {
	margin-top: .125em;
	margin-top: var(--space-xxxxs);
	margin-bottom: .125em;
	margin-bottom: var(--space-xxxxs)
}

.margin-y-xxxs {
	margin-top: .25em;
	margin-top: var(--space-xxxs);
	margin-bottom: .25em;
	margin-bottom: var(--space-xxxs)
}

.margin-y-xxs {
	margin-top: .375em;
	margin-top: var(--space-xxs);
	margin-bottom: .375em;
	margin-bottom: var(--space-xxs)
}

.margin-y-xs {
	margin-top: .5em;
	margin-top: var(--space-xs);
	margin-bottom: .5em;
	margin-bottom: var(--space-xs)
}

.margin-y-sm {
	margin-top: .75em;
	margin-top: var(--space-sm);
	margin-bottom: .75em;
	margin-bottom: var(--space-sm)
}

.margin-y-md {
	margin-top: 1.25em;
	margin-top: var(--space-md);
	margin-bottom: 1.25em;
	margin-bottom: var(--space-md)
}

.margin-y-lg {
	margin-top: 2em;
	margin-top: var(--space-lg);
	margin-bottom: 2em;
	margin-bottom: var(--space-lg)
}

.margin-y-xl {
	margin-top: 3.25em;
	margin-top: var(--space-xl);
	margin-bottom: 3.25em;
	margin-bottom: var(--space-xl)
}

.margin-y-xxl {
	margin-top: 5.25em;
	margin-top: var(--space-xxl);
	margin-bottom: 5.25em;
	margin-bottom: var(--space-xxl)
}

.margin-y-xxxl {
	margin-top: 8.5em;
	margin-top: var(--space-xxxl);
	margin-bottom: 8.5em;
	margin-bottom: var(--space-xxxl)
}

.margin-y-xxxxl {
	margin-top: 13.75em;
	margin-top: var(--space-xxxxl);
	margin-bottom: 13.75em;
	margin-bottom: var(--space-xxxxl)
}

.margin-y-auto {
	margin-top: auto;
	margin-bottom: auto
}

@media not all and (min-width:32rem) {
	.has-margin\@xs {
		margin: 0 !important
	}
}

@media not all and (min-width:48rem) {
	.has-margin\@sm {
		margin: 0 !important
	}
}

@media not all and (min-width:64rem) {
	.has-margin\@md {
		margin: 0 !important
	}
}

@media not all and (min-width:80rem) {
	.has-margin\@lg {
		margin: 0 !important
	}
}

@media not all and (min-width:90rem) {
	.has-margin\@xl {
		margin: 0 !important
	}
}

.text-replace {
	overflow: hidden;
	color: transparent;
	text-indent: 100%;
	white-space: nowrap
}

.text-center {
	text-align: center
}

.text-left {
	text-align: left
}

.text-right {
	text-align: right
}

@media (min-width:32rem) {
	.text-center\@xs {
		text-align: center
	}

	.text-left\@xs {
		text-align: left
	}

	.text-right\@xs {
		text-align: right
	}
}

@media (min-width:48rem) {
	.text-center\@sm {
		text-align: center
	}

	.text-left\@sm {
		text-align: left
	}

	.text-right\@sm {
		text-align: right
	}
}

@media (min-width:64rem) {
	.text-center\@md {
		text-align: center
	}

	.text-left\@md {
		text-align: left
	}

	.text-right\@md {
		text-align: right
	}
}

@media (min-width:80rem) {
	.text-center\@lg {
		text-align: center
	}

	.text-left\@lg {
		text-align: left
	}

	.text-right\@lg {
		text-align: right
	}
}

@media (min-width:90rem) {
	.text-center\@xl {
		text-align: center
	}

	.text-left\@xl {
		text-align: left
	}

	.text-right\@xl {
		text-align: right
	}
}

.color-inherit {
	color: inherit
}

.color-contrast-medium {
	color: #79797b;
	color: var(--color-contrast-medium, #79797c)
}

:root,
[data-theme=default] {
	--color-primary-darker: hsl(220,
			90%,
			36%);
	--color-primary-darker-h: 220;
	--color-primary-darker-s: 90%;
	--color-primary-darker-l: 36%;
	--color-primary-dark: hsl(220,
			90%,
			46%);
	--color-primary-dark-h: 220;
	--color-primary-dark-s: 90%;
	--color-primary-dark-l: 46%;
	--color-primary: hsl(220,
			90%,
			56%);
	--color-primary-h: 220;
	--color-primary-s: 90%;
	--color-primary-l: 56%;
	--color-primary-light: hsl(220,
			90%,
			66%);
	--color-primary-light-h: 220;
	--color-primary-light-s: 90%;
	--color-primary-light-l: 66%;
	--color-primary-lighter: hsl(220,
			90%,
			76%);
	--color-primary-lighter-h: 220;
	--color-primary-lighter-s: 90%;
	--color-primary-lighter-l: 76%;
	--color-accent-darker: hsl(355,
			90%,
			41%);
	--color-accent-darker-h: 355;
	--color-accent-darker-s: 90%;
	--color-accent-darker-l: 41%;
	--color-accent-dark: hsl(355,
			90%,
			51%);
	--color-accent-dark-h: 355;
	--color-accent-dark-s: 90%;
	--color-accent-dark-l: 51%;
	--color-accent: hsl(355,
			90%,
			61%);
	--color-accent-h: 355;
	--color-accent-s: 90%;
	--color-accent-l: 61%;
	--color-accent-light: hsl(355,
			90%,
			71%);
	--color-accent-light-h: 355;
	--color-accent-light-s: 90%;
	--color-accent-light-l: 71%;
	--color-accent-lighter: hsl(355,
			90%,
			81%);
	--color-accent-lighter-h: 355;
	--color-accent-lighter-s: 90%;
	--color-accent-lighter-l: 81%;
	--color-black: hsl(240,
			8%,
			12%);
	--color-black-h: 240;
	--color-black-s: 8%;
	--color-black-l: 12%;
	--color-white: hsl(0,
			0%,
			100%);
	--color-white-h: 0;
	--color-white-s: 0%;
	--color-white-l: 100%;
	--color-success-darker: hsl(94,
			48%,
			36%);
	--color-success-darker-h: 94;
	--color-success-darker-s: 48%;
	--color-success-darker-l: 36%;
	--color-success-dark: hsl(94,
			48%,
			46%);
	--color-success-dark-h: 94;
	--color-success-dark-s: 48%;
	--color-success-dark-l: 46%;
	--color-success: hsl(94,
			48%,
			56%);
	--color-success-h: 94;
	--color-success-s: 48%;
	--color-success-l: 56%;
	--color-success-light: hsl(94,
			48%,
			66%);
	--color-success-light-h: 94;
	--color-success-light-s: 48%;
	--color-success-light-l: 66%;
	--color-success-lighter: hsl(94,
			48%,
			76%);
	--color-success-lighter-h: 94;
	--color-success-lighter-s: 48%;
	--color-success-lighter-l: 76%;
	--color-error-darker: hsl(355,
			90%,
			41%);
	--color-error-darker-h: 355;
	--color-error-darker-s: 90%;
	--color-error-darker-l: 41%;
	--color-error-dark: hsl(355,
			90%,
			51%);
	--color-error-dark-h: 355;
	--color-error-dark-s: 90%;
	--color-error-dark-l: 51%;
	--color-error: hsl(355,
			90%,
			61%);
	--color-error-h: 355;
	--color-error-s: 90%;
	--color-error-l: 61%;
	--color-error-light: hsl(355,
			90%,
			71%);
	--color-error-light-h: 355;
	--color-error-light-s: 90%;
	--color-error-light-l: 71%;
	--color-error-lighter: hsl(355,
			90%,
			81%);
	--color-error-lighter-h: 355;
	--color-error-lighter-s: 90%;
	--color-error-lighter-l: 81%;
	--color-warning-darker: hsl(46,
			100%,
			41%);
	--color-warning-darker-h: 46;
	--color-warning-darker-s: 100%;
	--color-warning-darker-l: 41%;
	--color-warning-dark: hsl(46,
			100%,
			51%);
	--color-warning-dark-h: 46;
	--color-warning-dark-s: 100%;
	--color-warning-dark-l: 51%;
	--color-warning: hsl(46,
			100%,
			61%);
	--color-warning-h: 46;
	--color-warning-s: 100%;
	--color-warning-l: 61%;
	--color-warning-light: hsl(46,
			100%,
			71%);
	--color-warning-light-h: 46;
	--color-warning-light-s: 100%;
	--color-warning-light-l: 71%;
	--color-warning-lighter: hsl(46,
			100%,
			81%);
	--color-warning-lighter-h: 46;
	--color-warning-lighter-s: 100%;
	--color-warning-lighter-l: 81%;
	--color-bg: hsl(0,
			0%,
			100%);
	--color-bg-h: 0;
	--color-bg-s: 0%;
	--color-bg-l: 100%;
	--color-contrast-lower: hsl(0,
			0%,
			95%);
	--color-contrast-lower-h: 0;
	--color-contrast-lower-s: 0%;
	--color-contrast-lower-l: 95%;
	--color-contrast-low: hsl(240,
			1%,
			83%);
	--color-contrast-low-h: 240;
	--color-contrast-low-s: 1%;
	--color-contrast-low-l: 83%;
	--color-contrast-medium: hsl(240,
			1%,
			48%);
	--color-contrast-medium-h: 240;
	--color-contrast-medium-s: 1%;
	--color-contrast-medium-l: 48%;
	--color-contrast-high: hsl(240,
			4%,
			20%);
	--color-contrast-high-h: 240;
	--color-contrast-high-s: 4%;
	--color-contrast-high-l: 20%;
	--color-contrast-higher: hsl(240,
			8%,
			12%);
	--color-contrast-higher-h: 240;
	--color-contrast-higher-s: 8%;
	--color-contrast-higher-l: 12%
}

@supports (--css:variables) {
	@media (min-width:64rem) {
		:root {
			--space-unit: 1.25em
		}
	}
}

:root {
	--radius: 0.25em
}

:root {
	--font-primary: sans-serif;
	--text-base-size: 1em;
	--text-scale-ratio: 1.2;
	--text-xs: calc(1em/var(--text-scale-ratio)/var(--text-scale-ratio));
	--text-sm: calc(var(--text-xs)*var(--text-scale-ratio));
	--text-md: calc(var(--text-sm)*var(--text-scale-ratio)*var(--text-scale-ratio));
	--text-lg: calc(var(--text-md)*var(--text-scale-ratio));
	--text-xl: calc(var(--text-lg)*var(--text-scale-ratio));
	--text-xxl: calc(var(--text-xl)*var(--text-scale-ratio));
	--text-xxxl: calc(var(--text-xxl)*var(--text-scale-ratio));
	--body-line-height: 1.4;
	--heading-line-height: 1.2;
	--font-primary-capital-letter: 1
}

@supports (--css:variables) {
	@media (min-width:64rem) {
		:root {
			--text-base-size: 1.25em;
			--text-scale-ratio: 1.25
		}
	}
}

.text-component blockquote {
	padding-left: 1em;
	border-left: 4px solid #d3d3d4;
	border-left: 4px solid var(--color-contrast-low)
}

.text-component hr {
	background: #d3d3d4;
	background: var(--color-contrast-low);
	height: 1px
}

.text-component figcaption {
	font-size: .83333em;
	font-size: var(--text-sm);
	color: #79797b;
	color: var(--color-contrast-medium)
}

:root {
	--cd-color-1: hsl(214,
			28%,
			20%);
	--cd-color-1-h: 214;
	--cd-color-1-s: 28%;
	--cd-color-1-l: 20%;
	--cd-color-2: hsl(151,
			13%,
			66%);
	--cd-color-2-h: 151;
	--cd-color-2-s: 13%;
	--cd-color-2-l: 66%;
	--cd-color-3: hsl(213,
			9%,
			44%);
	--cd-color-3-h: 213;
	--cd-color-3-s: 9%;
	--cd-color-3-l: 44%;
	--font-primary: 'Open Sans', sans-serif;
	--font-secondary: 'Merriweather', serif
}

.cd-main {
	overflow: hidden;
	height: auto
}

.cd-main__content {
    margin-top: 0;
	position: relative;
	z-index: 2;
	background-color: #9db3a8;
	background-color: var(--cd-color-2);
	will-change: transform;
	transition: -webkit-transform .7s cubic-bezier(.91, .01, .6, .99);
	transition: transform .7s cubic-bezier(.91, .01, .6, .99);
	transition: transform .7s cubic-bezier(.91, .01, .6, .99), -webkit-transform .7s cubic-bezier(.91, .01, .6, .99)
}

.nav-is-open .cd-main__content {
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
	transform: translateX(100%)
}

.js .cd-nav {
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: #000;
	visibility: hidden;
	transition: visibility .7s;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.js .cd-nav a {
	text-decoration: none
}

.js .cd-nav__title {
	position: relative;
	font-size: .69444em;
	font-size: var(--text-xs);
	font-weight: 600;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: .15em
}

.js .cd-nav__title::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -20px;
	height: 1px;
	width: 60px;
	background-color: currentColor
}

.js .nav-is-open .cd-nav {
	visibility: visible
}

.js .cd-nav__content {
	height: 100%;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 2em 0 2em 80px;
	padding: var(--space-lg) 0 var(--space-lg) 80px;
	will-change: transform;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	transition: -webkit-transform .7s cubic-bezier(.86, .01, .77, .78);
	transition: transform .7s cubic-bezier(.86, .01, .77, .78);
	transition: transform .7s cubic-bezier(.86, .01, .77, .78), -webkit-transform .7s cubic-bezier(.86, .01, .77, .78)
}

@media (min-width:64rem) {
	.js .cd-nav__content {
		padding-left: 0
	}
}

@media (max-width:1920px) {
	.js .cd-nav__content .container {
		width: 100%;
		padding: 0 8%
	}
}

.js .nav-is-open .cd-nav__content {
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	transition: -webkit-transform .5s cubic-bezier(.82, .01, .77, .78);
	transition: transform .5s cubic-bezier(.82, .01, .77, .78);
	transition: transform .5s cubic-bezier(.82, .01, .77, .78), -webkit-transform .5s cubic-bezier(.82, .01, .77, .78)
}

.js .cd-nav__primary {
	margin-top: 3.25em;
	margin-top: var(--space-xl)
}

.js .cd-nav__primary li {
	margin-bottom: 1.25em;
	margin-bottom: var(--space-md)
}

.js .cd-nav__link {
	font-family: lato;
	font-size: 1.44em;
	font-size: var(--text-lg);
	color: #fff
}

@media (min-width:80rem) {
	.js .cd-nav__link {
		font-size: 26px;
		font-family: alef;
		letter-spacing: 1px;
		font-weight: 900
	}
}

.js .cd-nav__link-selected,
.js .cd-nav__link:hover {
	color: #fff
}

.js .cd-nav__contact {
	margin-top: 3.25em;
	margin-top: var(--space-xl)
}

.js .cd-nav__contact li {
	font-family: Merriweather, serif;
	float: left;
	margin-left: 30px;
	font-family: var(--font-secondary);
	margin-bottom: 1.25em;
	margin-bottom: var(--space-md);
	color: hsla(0, 0%, 100%, .3);
	color: hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), .3)
}

.js .cd-nav__contact a {
	opacity: .6;
	background-color: #ff0
}

.js .cd-nav__contact a:hover {
	opacity: 1
}

@media (min-width:64rem) {
	.js .cd-nav__contact {
		margin-top: calc(3.25em + 20px);
		margin-top: calc(var(--space-xl) + 20px) margin-top: 5%
	}
}

.cd-nav-trigger {
	display: none;
	position: fixed;
	z-index: 100;
	top: 10px;
	right: 1.25em;
	right: var(--component-padding);
	height: 40px;
	width: 40px;
	border-radius: 50%;
	transition: -webkit-transform .5s;
	transition: transform .5s;
	transition: transform .5s, -webkit-transform .5s
}

.cd-nav-trigger:active .cd-nav-trigger__icon {
	-webkit-transform: scale(.9);
	-ms-transform: scale(.9);
	transform: scale(.9)
}

.cd-nav-trigger svg {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%
}

.cd-nav-trigger circle {
	stroke: #666f7a;
	stroke: var(--cd-color-3);
	transition: stroke-dashoffset .4s
}

.nav-is-open .cd-nav-trigger {
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg)
}

.nav-is-open .cd-nav-trigger circle {
	stroke-dashoffset: 0;
	transition: stroke-dashoffset .4s .3s
}

.cd-nav-trigger__icon {
	position: absolute;
	top: calc(50% - 1px);
	left: calc(50% - 12px);
	width: 22px;
	height: 2px;
	background-color: #fff;
	transition: -webkit-transform .3s;
	transition: transform .3s;
	transition: transform .3s, -webkit-transform .3s
}

.cd-nav-trigger__icon::before,
.cd-nav-trigger__icon:after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 70%;
	height: 100%;
	background-color: inherit;
	will-change: transform, width, top;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: width .5s, top .3s, -webkit-transform .5s;
	transition: transform .5s, width .5s, top .3s;
	transition: transform .5s, width .5s, top .3s, -webkit-transform .5s
}

.cd-nav-trigger__icon::before {
	-webkit-transform-origin: right top;
	-ms-transform-origin: right top;
	transform-origin: right top;
	-webkit-transform: translateY(-6px);
	-ms-transform: translateY(-6px);
	transform: translateY(-6px)
}

.cd-nav-trigger__icon::after {
	-webkit-transform-origin: right bottom;
	-ms-transform-origin: right bottom;
	transform-origin: right bottom;
	-webkit-transform: translateY(6px);
	-ms-transform: translateY(6px);
	transform: translateY(6px);
	width: 100%
}

.nav-is-open .cd-nav-trigger__icon::after,
.nav-is-open .cd-nav-trigger__icon::before {
	width: 50%
}

.nav-is-open .cd-nav-trigger__icon::before {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg)
}

.nav-is-open .cd-nav-trigger__icon::after {
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg)
}

.nav-is-open .cd-nav-trigger:hover .cd-nav-trigger__icon::after,
.nav-is-open .cd-nav-trigger:hover .cd-nav-trigger__icon::before {
	top: 0
}

.cd-main__content {
	background-color: #161717;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center
}

.cd-main__content h1 {
	color: #243141;
	color: var(--cd-color-1)
}

.cd-main__content p {
	font-family: Merriweather, serif;
	font-family: var(--font-secondary);
	color: hsl(151, 13%, 85.8%);
	color: hsl(var(--cd-color-2-h), var(--cd-color-2-s), calc(var(--cd-color-2-l)*1.3))
}

.cd-article-link {
	font-family: 'Open Sans', sans-serif;
	font-family: var(--font-primary);
	color: #243141;
	color: var(--cd-color-1);
	font-size: .83333em;
	font-size: var(--text-sm);
	transition: opacity .2s
}

.cd-article-link:hover {
	opacity: .8
}

.four_boxes_main {
	background-image: url(../images/uifstechnologies/mobile_app_float_back.png);
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: 50px;
	background-color: #eef3f7
}

.banner_mobile_app_main {
	background-image: url(../images/uifstechnologies/mobile_app_banner.png);
	background-repeat: no-repeat;
	min-height: 810px;
	z-index: 3;
	background-size: cover;
	background-color: #eef3f7
}

.banner_mobile_app {
	padding: 200px 0 0 100px
}

.banner_mobile_app h3 {
	font-family: fantasy;
	font-size: 58px;
	color: #fff;
	font-weight: 100;
	letter-spacing: 13px
}

.banner_mobile_app h3::after {
	content: "";
	display: block;
	position: absolute;
	border-top: 3px solid #03bfff;
	width: 460px;
	margin-top: 10px
}

.banner_mobile_app h1 {
	font-family: beyonce;
	font-size: 35px;
	color: #fff;
	padding-left: 7px;
	letter-spacing: 14px
}

.banner_mobile_app p {
	font-family: beyonce;
	font-size: 35px;
	color: #fff;
	padding-left: 7px;
	letter-spacing: 14px
}

.banner_mobile_app h2 {
	font-family: cursive;
	font-size: 48px;
	color: #fff;
	letter-spacing: 3px;
	line-height: 20px;
	letter-spacing: 14px
}

.banner_mobile_app h4 {
	color: #f0f8ff;
	font-size: 19px;
	font-family: lato;
	font-weight: 100;
	padding-top: 10px;
	margin-bottom: 40px
}

.mobile_app_banner_btn {
	margin-top: 40px;
	font-size: 16px;
	font-weight: 300;
	color: #edeaea;
	border: 1px solid #311b74;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	background: linear-gradient(to right, #e5422b 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.mobile_app_banner_btn:hover {
	background-position: left bottom;
	border: 1px solid #e5422b
}

.home_skills_btn {
	margin-top: 40px;
	font-size: 16px;
	font-weight: 300;
	color: #edeaea;
	border: 1px solid #fff;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	background: linear-gradient(to right, #e5422b 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.home_skills_btn:hover {
	background-position: left bottom;
	border: 1px solid #fff;
	color: #fff
}

.four_boxes {
	padding-left: 80px
}

.box1 {
	width: 260px;
	height: 230px;
	color: #3f3b3c;
	border-radius: 6px;
	border: 1px solid #fff;
	background-color: #fff;
	box-shadow: 3px 3px 15px -5px;
	margin-bottom: 30px;
	padding: 20px;
	font-size: 18px;
	transition: transform 1s;
	transform: rotate(8deg)
}

.box1:hover {
	width: 260px;
	height: 230px;
	color: #3f3b3c;
	border-radius: 6px;
	border: 1px solid #fff;
	background-color: #fff;
	box-shadow: 3px 3px 15px -5px;
	margin-bottom: 30px;
	padding: 20px;
	font-size: 18px;
	transition: transform 1s;
	transform: rotate(-8deg)
}

.box1 img {
	transition: transform 1s
}

.box1 img:hover {
	transform: scale(1.1);
	transform: rotate(-15deg)
}

.box {
	width: 260px;
	height: 230px;
	color: #3f3b3c;
	border-radius: 6px;
	border: 1px solid #fff;
	background-color: #fff;
	box-shadow: 3px 3px 15px -5px;
	margin-bottom: 30px;
	padding: 20px;
	font-size: 18px;
	transition: transform 1s
}

.box:hover {
	transform: rotate(15deg)
}

.box img {
	transition: transform 1s
}

.box img:hover {
	transform: scale(1.1);
	transform: rotate(-15deg)
}

.boxes {
	margin-top: 50px
}

.mobile_app_floating_back {
	position: absolute;
	top: 600px;
	left: 0;
	min-height: 752px
}

.four_boxes_title {
	font-size: 40px;
	color: #2b2c4a
}

.four_boxes_para {
	font-family: clear sans;
	font-weight: 500;
	color: #777;
	font-size: 18px;
	line-height: 30px;
	padding-right: 80px;
	padding-top: 20px;
	margin-bottom: 30px
}

.four_boxes_para_sec1 {
	font-family: clear sans;
	font-weight: 500;
	color: #777;
	font-size: 18px;
	line-height: 30px;
	padding-right: 90px;
	padding-top: 20px;
	margin-bottom: 30px
}

.mobile_app_btn {
	font-size: 16px;
	font-weight: 300;
	color: #07121e;
	border: 1px solid #87898d;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	background: linear-gradient(to right, #ea2a0f 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.mobile_app_btn:hover {
	background-position: left bottom;
	color: #fff
}

.four_boxes_content {
	padding-top: 100px;
	padding-left: 60px
}

.mobile_app_sec1 {
	background-image: url(../images/uifstechnologies/mobile_app_sec1_back.jpg);
	background-repeat: no-repeat;
	padding-top: 80px
}

.mobile_app_sec2 {
	bac kground-image: url(../images/uifstechnologies/mobile_app_sec2_back.jpg);
	background-repeat: no-repeat;
	padding-top: 80px
}

.mobile_app_sec3 {
	padding-top: 10px
}

.mobile_app_sec4 {
	padding-top: 10px
}

.mobile_app_sec2_img {
	padding-left: 150px
}

.mobile_app_sec1_content {
	padding-top: 120px;
	padding-left: 160px
}

.four_boxes_sec2_content {
	padding-top: 40px;
	padding-left: 60px;
	padding-right: 30px
}

.banner_customer_support_main {
	background-image: url(../images/uifstechnologies/customer_support_banner.jpg);
	background-repeat: no-repeat;
	min-height: 650px;
	z-index: 3;
	width: 100%;
	background-size: cover
}

.customer_support_sec2 {
	padding: 50px 0
}

.customer_support_sec3_title {
	font-size: 36px;
	color: #07121e;
	font-family: clear sans;
	font-weight: 500;
	padding-bottom: 30px
}

.customer_support_sec3_title {
	font-size: 36px;
	color: #07121e;
	font-family: clear sans;
	font-weight: 500;
	padding-bottom: 30px
}

.testimonials_section3_points_title {
	padding-top: 50px;
	padding-left: 10%;
	padding-right: 5%
}

.testimonials_section3_points_title h1 {
	font-family: clear sans;
	font-size: 24px;
	font-weight: 500;
	color: #07121e;
	padding-left: 50px
}

.testimonials_section3_points_title h1::before {
	width: 13px;
	height: 13px;
	background-color: #000841;
	content: "";
	display: table-cell;
	position: absolute;
	margin-top: 8px;
	margin-left: -25px
}

.testimonials_section3_points_title p {
	font-family: clear sans;
	font-size: 16px;
	font-weight: 500;
	color: #7d7d7d;
	padding-left: 50px
}

.testimonials_section3_points_title ul li {
	padding-bottom: 10px
}

.ending_customer_support {
	color: #fff;
	padding-top: 20px;
	padding-bottom: 30px
}

.testimonials_section3_points_title h3 {
	font-size: 16px;
	padding-bottom: 20px
}

.banner_live_chat_main {
	background-image: url(../404.html);
	background-repeat: no-repeat;
	min-height: 650px;
	z-index: 3;
	width: 100%;
	background-size: cover
}

.support {
	padding: 200px 0 0 100px
}

.support h4 {
	color: #f0f8ff;
	font-size: 19px;
	font-family: lato;
	font-weight: 100;
	padding-top: 10px;
	padding-bottom: 40px
}

.support h3 {
	font-family: monospace;
	font-size: 40px;
	color: #fff;
	font-weight: 100;
	letter-spacing: 2px;
	padding-bottom: 12px
}

.support h3::after {
	content: "";
	display: block;
	position: absolute;
	border-top: 3px solid #03bfff;
	width: 460px;
	margin-top: 10px
}

.support h2 {
	font-family: monospace;
	font-size: 30px;
	color: #fff;
	font-weight: 100;
	letter-spacing: 2px
}

.support h2 img {
	width: 35px;
	height: 38px
}

.support_banner_btn {
	margin-top: 40px;
	font-size: 16px;
	font-weight: 300;
	color: #edeaea;
	border: 1px solid #311b74;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	background: linear-gradient(to right, #e5422b 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.support_banner_btn:hover {
	background-position: left bottom;
	border: 1px solid #e5422b
}

.banner_server_support_main {
	background-image: url(../images/uifstechnologies/server_support_banner.jpg);
	background-repeat: no-repeat;
	min-height: 685px;
	z-index: 3;
	width: 100%;
	background-size: cover
}

.banner_server_support {
	padding: 15% 55% 0 8%
}

.banner_server_support h3 {
	font-family: lato;
	font-weight: 800;
	font-size: 50px;
	color: #fff;
	text-transform: uppercase
}

.banner_server_support h4 {
	font-family: lato;
	font-weight: 400;
	font-size: 18px;
	line-height: 29px;
	color: #fff;
	padding-bottom: 40px
}

.server_support_sec2_content {
	padding-top: 20px;
	padding-left: 15%
}

.server_support_sec2_para {
	font-family: clear sans;
	font-weight: 500;
	color: #07121e;
	font-size: 17px;
	padding-top: 20px;
	line-height: 30px
}

.server_support_sec2_title {
	padding-top: 20px;
	font-family: lato;
	font-size: 38px;
	color: #07121e;
	font-weight: 700
}

.banner_iot_main {
	background-image: url(../images/uifstechnologies/iot_banner.jpg);
	background-repeat: no-repeat;
	min-height: 600px;
	background-color: #151759;
	background-size: cover
}

.banner_iot {
	padding: 2% 0 3% 5%;
	text-align: left;
	margin: 10% auto 0 auto
}

.banner_iot h3 {
	color: #fff;
	font-family: cursive;
	font-size: 48px;
	letter-spacing: 2px;
	text-shadow: 0 0 50px #000
}

.banner_iot h4 {
	width: 44%;
	color: #fff;
	font-family: lato;
	font-size: 26px;
	text-shadow: 0 0 50px #000;
	font-weight: 100;
	letter-spacing: 4px;
	padding-top: 15px;
	padding-bottom: 40px
}

.iot_banner_btn {
	margin-top: 30px;
	font-size: 16px;
	font-weight: 300;
	color: #edeaea;
	border: 1px solid #e5422b;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	background: linear-gradient(to right, #e5422b 0, transparent 0);
	background-size: 200% 100%;
	box-shadow: 0 0 50px #4a4a4a;
	background-position: right bottom;
	transition: all .3s ease-out
}

.iot_banner_btn:hover {
	background: linear-gradient(to right, #e5422b 100%, transparent 100%)
}

.iot_sec2 {
	text-align: center;
	width: 50%;
	margin: 5% auto 0
}

.iot_sec2 h1 {
	font-family: lato;
	font-size: 90px;
	font-weight: 900;
	color: #494141
}

.iot_sec2 h2 {
	font-family: lato;
	font-size: 100px;
	font-weight: 900;
	color: #de9f8c;
	line-height: 100px
}

.brown {
	color: #494141
}

.v_line {
	background-color: rgba(26, 26, 26, .5);
	min-height: 150px;
	width: 2px;
	margin: 0 auto
}

.iot_sec4 h1 {
	color: #191919;
	font-family: lato;
	font-size: 65px;
	font-weight: 900;
	padding: 5%
}

.iot_sec4 p {
	color: #191919;
	font-family: lato;
	font-size: 18px;
	font-weight: 400;
	padding-left: 5%
}

.iot_sec4 img {
	box-shadow: 0 0 49px #989898;
	width: 100%;
	background-size: cover
}

.iot_sec4_arrow img {
	box-shadow: none;
	width: auto;
	padding-left: 5%
}

.iot_sec5 {
	margin: 8% auto
}

.iot_sec5 h1 {
	color: #191919;
	font-family: lato;
	font-size: 65px;
	font-weight: 900
}

.iot_sec5 p {
	color: #191919;
	font-family: lato;
	font-size: 24px;
	font-weight: 500
}

.iot_sec5_box1,
.iot_sec5_box2,
.iot_sec5_box3,
.iot_sec5_box4,
.iot_sec5_box5,
.iot_sec5_box6 {
	padding-bottom: 100px;
	padding: 0;
	font-size: 24px;
	text-transform: uppercase;
	color: #fff
}

.iot_sec5_box1 h1,
.iot_sec5_box2 h1,
.iot_sec5_box3 h1,
.iot_sec5_box4 h1,
.iot_sec5_box5 h1,
.iot_sec5_box6 h1 {
	font-family: clear sans;
	font-size: 20px;
	text-transform: capitalize;
	color: #fff;
	text-align: left;
	padding-left: 25px;
	margin-top: 10px;
	padding-bottom: 0;
	margin-bottom: 0
}

.iot_sec5_imgbox {
	width: 96%
}

.iot_sec5_box1 {
	background-color: #000841;
	margin-right: 2%;
	margin-bottom: 2%;
	width: 32%;
	margin-top: 2%
}

.iot_sec5_box2 {
	background-color: #293846;
	margin-right: 2%;
	margin-bottom: 2%;
	width: 32%;
	margin-top: 2%
}

.iot_sec5_box3 {
	background-color: #1e1a34;
	margin-bottom: 2%;
	width: 32%;
	margin-top: 2%
}

.iot_sec5_box4 {
	background-color: #1e1a34;
	margin-right: 2%;
	margin-bottom: 2%;
	width: 32%
}

.iot_sec5_box5 {
	background-color: #333035;
	margin-right: 2%;
	margin-bottom: 2%;
	width: 32%
}

.iot_sec5_box6 {
	background-color: #28b29a;
	margin-bottom: 2%;
	width: 32%
}

.iot_sec5_imgbox img {
	width: 100%;
	background-size: cover
}

.h_line {
	width: 15%;
	height: 2px;
	background-color: #fff;
	margin-left: 25px;
	margin-top: 10px;
	margin-bottom: 10px
}

.banner_services_main {
	background-color: #161717
}

.banner_services {
	padding: 2% 0 7% 0;
	width: 75%;
	text-align: center;
	margin: 13% auto 0 auto
}

.banner_services h5 {
	color: #fff;
	font-family: clear sans;
	font-size: 70px
}

.banner_services h4 {
	color: #909090;
	font-family: clear sans;
	font-size: 22px;
	font-weight: 400;
	line-height: 34px
}

.logo_brand {
	position: absolute;
	top: 5.5%;
	right: 27%;
	z-index: 9;
	opacity: .05
}

.sec2_services {
	padding: 50px 50px;
	background-color: #161717;
    background: linear-gradient(159deg,#161717 50%,#e5e5e5 49%);
}

.services_box1 {
	background-color: #00a2e2;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	transition: 1s;
	min-height: 370px
}

.services_box2 {
    background-color: #7f4187;
    text-align: center;
    border-radius: 8px;
    color: #fff;
    padding: 20px 20px;
    margin-top: 50px;
    transition: 1s;
    min-height: 370px;
}

.services_box3 {
	background-color: #ffad02;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	transition: 1s;
	min-height: 370px
}

.services_box4 {
	background-color: #00bc87;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	margin-top: 50px;
	transition: 1s;
	min-height: 370px
}

.services_box5 {
	background-color: #e5422b;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	transition: 1s;
	min-height: 370px
}

.services_box6 {
	background-color: #fda727;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	margin-top: 50px;
	transition: 1s;
	min-height: 370px
}

.services_box7 {
	background-color: #909090;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	transition: 1s;
	min-height: 370px
}

.services_box8 {
	background-color: #a94442;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	margin-top: 50px;
	transition: 1s;
	min-height: 370px
}

.services_box9 {
	background-color: #333;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	transition: 1s;
	min-height: 370px
}

.services_box10 {
	background-color: #009688;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	margin-top: 50px;
	transition: 1s;
	min-height: 370px
}

.services_box11 {
	background-color: #72c180;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	transition: 1s;
	min-height: 370px
}

.services_box12 {
	background-color: #4e8896;
	text-align: center;
	border-radius: 8px;
	color: #fff;
	padding: 20px 20px;
	margin-top: 50px;
	transition: 1s;
	min-height: 370px
}

.services_box10:hover,
.services_box11:hover,
.services_box12:hover,
.services_box1:hover,
.services_box2:hover,
.services_box3:hover,
.services_box4:hover,
.services_box5:hover,
.services_box6:hover,
.services_box7:hover,
.services_box8:hover,
.services_box9:hover {
	background-color: #1b1c1c !important;
}

.services_box1 h2,
.services_box10 h2,
.services_box11 h2,
.services_box12 h2,
.services_box2 h2,
.services_box3 h2,
.services_box4 h2,
.services_box5 h2,
.services_box6 h2,
.services_box7 h2,
.services_box8 h2,
.services_box9 h2 {
	font-family: lato;
	font-weight: 600;
	font-size: 22px;
	color: #fff
}

.services_box1 p,
.services_box10 p,
.services_box11 p,
.services_box12 p,
.services_box2 p,
.services_box3 p,
.services_box4 p,
.services_box5 p,
.services_box6 p,
.services_box7 p,
.services_box8 p,
.services_box9 p {
	font-family: lato;
	font-weight: 500;
	font-size: 18px;
	line-height: 25px;
	color: #fff;
	padding-top: 10px
}

.services_icon {
	text-align: center;
	margin: 0 auto;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background-color: #121212;
	line-height: 100px
}

.services_box_btn {
	display: none
}

.services_box10:hover h2,
.services_box11:hover h2,
.services_box12:hover h2,
.services_box1:hover h2,
.services_box2:hover h2,
.services_box3:hover h2,
.services_box4:hover h2,
.services_box5:hover h2,
.services_box6:hover h2,
.services_box7:hover h2,
.services_box8:hover h2,
.services_box9:hover h2 {
	font-weight: 600;
	font-size: 22px;
	color: #fff
}

.services_box10:hover p,
.services_box11:hover p,
.services_box12:hover p,
.services_box1:hover p,
.services_box2:hover p,
.services_box3:hover p,
.services_box4:hover p,
.services_box5:hover p,
.services_box6:hover p,
.services_box7:hover p,
.services_box8:hover p,
.services_box9:hover p {
	color: #fff
}

.services_box10:hover .services_icon,
.services_box11:hover .services_icon,
.services_box12:hover .services_icon,
.services_box1:hover .services_icon,
.services_box2:hover .services_icon,
.services_box3:hover .services_icon,
.services_box4:hover .services_icon,
.services_box5:hover .services_icon,
.services_box6:hover .services_icon,
.services_box7:hover .services_icon,
.services_box8:hover .services_icon,
.services_box9:hover .services_icon {
	background-color: transparent;
	border: 3px dotted rgba(29, 29, 29, .1);
	line-height: 95px
}

.chatbot_integrations_icons {
	padding-top: 50px
}

.banner_chat_bot_main {
	background-image: url(../images/uifstechnologies/chat_bot_banner.jpg);
	background-repeat: no-repeat;
	min-height: 650px;
	z-index: 3;
	width: 100%;
	background-size: cover
}

.banner_chat_bot {
	padding: 200px 0 0 100px
}

.banner_chat_bot h3 {
	font-family: raleway;
	font-size: 90px;
	color: #fff;
	font-weight: 600;
	letter-spacing: 5px
}

.banner_chat_bot h4 {
	font-family: raleway;
	font-size: 18px;
	color: #fff;
	font-weight: 300;
	width: 40%;
	line-height: 28px;
	padding-bottom: 40px
}

.chat_bot_section2_title {
	font-family: lato;
	font-weight: 800;
	font-size: 40px;
	color: #101010;
	text-align: right;
	padding-right: 30%;
	letter-spacing: 1px
}

.chat_bot_section2_para {
	text-align: right;
	padding-right: 30%;
	font-family: clear sans;
	font-weight: 500;
	color: #07121e;
	font-size: 20px;
	padding-top: 20px;
	margin-bottom: 30px;
	line-height: 28px
}

.chat_bot_section2_content {
	padding-top: 100px
}

.chat_bot_btn {
	margin-right: 30%;
	float: right;
	font-size: 16px;
	font-weight: 300;
	color: #07121e;
	border: 1px solid #87898d;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	display: block;
	background: linear-gradient(to right, #ea2a0f 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.chat_bot_btn:hover {
	background-position: left bottom;
	border: 1px solid #e5422b
}

.chat_bot_section3 {
	background-color: #000841;
	background-repeat: no-repeat;
	padding-top: 80px;
	margin-top: 80px
}

.chat_bot_section3_content {
	padding-top: 90px;
	padding-left: 10%
}

.chat_bot_section3_title {
	font-family: clear sans;
	font-weight: 500;
	font-size: 40px;
	color: #fff;
	letter-spacing: 1px
}

.chat_bot_section3_para {
	font-family: clear sans;
	font-weight: 400;
	color: #fff;
	font-size: 20px;
	padding-right: 25px;
	padding-top: 20px;
	margin-bottom: 30px;
	line-height: 29px
}

.chat_bot_red_btn {
	font-size: 16px;
	font-weight: 300;
	color: #fff;
	border: 1px solid #fff;
	border-radius: 25px;
	padding: 12px 40px;
	background: linear-gradient(to right, #fff 50%, #ea2a0f 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.chat_bot_red_btn:hover {
	background-position: left bottom;
	color: #1f1f1f
}

.chat_bot_integrations_title {
	font-family: clear sans;
	font-size: 50px;
	letter-spacing: 2px;
	color: #fff
}

.chat_bot_integrations_para {
	font-family: clear sans;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: .5px;
	color: #fff
}

.chat_bot_integrations {
	padding: 50px 0 0;
	background-color: #f4f4fd;
	background-image: url(../images/uifstechnologies/skills-bg.jpg)
}

.chat_bot_integrations .ai_we_offer_techimg {
	margin-top: 50px
}

.chat_bot_ending_title {
	font-size: 22px;
	color: #fff;
	font-family: lato;
	font-weight: 500
}

.chat_bot_ending_subtitle {
	font-size: 100px;
	color: #fff;
	font-family: lato;
	font-weight: 500;
	transition: 1s
}

.chat_bot_ending_subtitle:hover {
	color: #f6b138
}

.four_boxes_title_ai {
	font-size: 45px;
	color: #333;
	font-family: fantasy;
	letter-spacing: 1px
}

.four_boxes_para_ai {
	font-family: alef;
	font-weight: 500;
	color: #3a3a3a;
	font-size: 18px;
	line-height: 30px;
	padding-right: 60px;
	padding-top: 20px;
	margin-bottom: 30px
}

.ai_we_offer_main {
	padding-top: 50px;
	background-color: #020940;
	margin-top: 100px
}

.ai_we_offer_main h1 {
	color: #fff;
	text-align: center;
	padding: 50px 0
}

.ai_we_offer_techimg {
	border-right: 1px solid #fff;
	text-align: center;
	margin-bottom: 100px
}

.ai_we_offer_quote {
	text-align: center;
	width: 72%;
	margin: 0 auto;
	padding: 50px 0
}

.ai_we_offer_quote h2 {
	font-family: "Playfair Display", serif;
	font-size: 36px;
	line-height: 50px;
	font-weight: 600;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #020940 0, #020940 35%, #2d2a2b 66%, #00c9d3 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite
}

.ai_we_offer_quote h3 {
	font-size: 16px;
	color: #848484;
	font-weight: 100
}

.ai_we_offer p {
	padding-bottom: 10px;
	font-size: 18px
}

.ai_we_offer h1 {
	font-size: 45px;
	font-family: fantasy;
	font-weight: 600;
	padding-top: 30px
}

.ai1,
.ai2,
.ai3,
.ai4,
.ai5,
.ai6,
.ai7,
.ai8 {
	width: 100%;
	height: 300px;
	margin-top: 5%;
	background-position: center bottom;
	background-size: cover;
	transform: scale(1);
	transition: all ease-in-out .5s
}

.common_ai {
	padding: 12px;
	margin: 0
}

.ai1 {
	background-image: url(../images/uifstechnologies/ai1.jpg);
	transition: 1s;
	animation: infinite ease-in-out
}

.ai2 {
	background-image: url(../images/uifstechnologies/ai2.jpg)
}

.ai3 {
	background-image: url(../images/uifstechnologies/ai3.jpg)
}

.ai4 {
	background-image: url(../images/uifstechnologies/ai4.jpg)
}

.ai5 {
	background-image: url(../images/uifstechnologies/ai5.jpg)
}

.ai6 {
	background-image: url(../images/uifstechnologies/ai6.jpg)
}

.ai7 {
	background-image: url(../images/uifstechnologies/ai7.jpg)
}

.ai8 {
	background-image: url(../images/uifstechnologies/ai8.jpg)
}

.ai_we_offer_main_ai {
	width: 90%;
	padding-top: 60px;
	text-align: center;
	margin: 0 auto
}

.ai_we_offer_main_ai h1 {
	padding-bottom: 20px;
	font-size: 45px;
	font-family: fantasy;
	letter-spacing: 2px
}

.four_boxes_main_ai {
	background-image: url(../images/uifstechnologies/mobile_app_float_back.png);
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: 50px;
	background-color: #eef3f7;
	padding-top: 80px
}

.four_boxes_content_ai {
	padding-top: 50px;
	padding-left: 150px
}

.banner_artificial_intelligence {
	padding-left: 80px;
	position: relative;
	top: 250px
}

.banner_artificial_intelligence_main {
	background-image: url(../images/uifstechnologies/banner_artificial_intelligence1.gif);
	background-repeat: no-repeat;
	min-height: 710px;
	background-color: #151759;
	background-size: cover;
	width: 100%
}

.banner_ux_desig_main {
	background-image: url(../images/uifstechnologies/banner_ux_design.gif);
	background-repeat: no-repeat;
	min-height: 710px;
	background-color: #151759;
	margin-bottom: 100px
}

.artificial_title {
	font-family: robo;
	font-size: 75px;
	color: #fff !important;
	letter-spacing: 4px
}

.intelligence_title {
	font-family: Beyonce;
	font-size: 70px;
	color: #fff
}

.ai_btn {
	font-size: 16px;
	font-weight: 300;
	text-align: center;
	color: #edeaea;
	border: 1px solid #311b74;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	display: block;
	background: linear-gradient(to right, #e5422b 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out;
	width: 200px
}

.ai_btn:hover {
	background-position: left bottom;
	border: 1px solid #e5422b
}

.some_words {
	padding: 0 50px;
	padding-bottom: 10px;
	text-align: center
}

.some_words_title {
	color: #453e3f;
	font-family: lato;
	font-size: 45px
}

video {
	pointer-events: none
}

.orange {
	color: #e5422b
}

.some_words p {
	font-size: 16px;
	color: #453e3f;
	font-weight: 600;
	padding-top: 30px
}

.ai_we_offer_main {
	background-image: url(../images/uifstechnologies/bg_artificial_intelligence.jpg)
}

.ai_we_offer {
	padding-bottom: 30px
}

.ai_we_offer h1 {
	color: #fff;
	font-size: 45px;
	font-family: sans-serif
}

.ai_we_offer h1::before {
	content: "";
	display: block;
	position: relative;
	border-left: 3px solid #1c1775;
	width: 3px;
	height: 60px;
	box-shadow: 1px 5px 10px #1c1775;
	margin-bottom: 20px
}

.ai_we_offer p {
	color: #fff;
	font-size: 18px;
	font-family: lato
}

.ai_we_offer_box {
	background-color: #000;
	padding: 60px;
	margin-top: 40px;
	margin-bottom: 100px;
	box-shadow: 0 0 7px #181465
}

.ai_we_offer_box h1 {
	color: #7faab1;
	font-size: 38px;
	letter-spacing: 2px;
	font-family: Beyonce;
	font-weight: 600
}

.ai_we_offer_box h5 {
	color: #1c1775;
	font-size: 16px
}

.ai_we_offer_box p {
	color: #fff;
	font-size: 19px;
	padding-right: 35px;
	line-height: 32px;
	padding-top: 10px;
	text-align: justify
}

.ai_how_box {
	background-color: #161717;
	padding: 50px 0;
	box-shadow: 0 -5px 7px #181465;
	height: 700px
}

.ai_how_box h1 {
	color: #ff4c43;
	font-family: beyonce;
	font-size: 30px;
	letter-spacing: 2px;
	font-weight: 600;
	text-align: left
}

.ai_how_box h5 {
	color: #fff;
	font-size: 31px;
	text-align: left
}

.ai_how_box p {
	color: #919191;
	font-size: 15px;
	line-height: 24px;
	padding-top: 10px;
	text-align: center
}

.ai_sec2 {
	position: absolute;
	width: 500;
	height: 400px;
	background-size: cover;
	z-index: 999;
	left: 150px;
	top: 70px
}

.hire_benefits_main {
	background-color: #f6f6f6;
	margin-bottom: 70px;
	padding: 70px 0 50px;
	text-align: center
}

.hire_benefits_main p {
	color: #444;
	font-size: 17px;
	line-height: 26px;
	width: 85%;
	margin: 0 auto
}

.hire_benefits_heading {
	width: 92%;
	display: inline-block;
	color: #393d3e;
	font-family: lato;
	font-size: 38px;
	font-weight: 400;
	line-height: 50px;
	margin-bottom: 24px
}

.hire_benefits_main .hire_benefits {
	margin: 0 auto;
	width: 760px;
	position: relative;
	margin-top: 60px
}

.benefit_first {
	left: 40px;
	position: absolute;
	top: 10px
}

.benefit_second {
	position: absolute;
	left: -60px;
	top: 110px
}

.benefit_third {
	position: absolute;
	left: -150px;
	top: 205px
}

.benefit_fourth {
	position: absolute;
	right: 50px;
	top: 10px
}

.benefit_fifth {
	position: absolute;
	right: -50px;
	top: 110px
}

.benefit_sixth {
	position: absolute;
	right: -150px;
	top: 205px
}

.benefit_fifth h4,
.benefit_first h4,
.benefit_fourth h4,
.benefit_second h4,
.benefit_sixth h4,
.benefit_third h4 {
	float: left;
	font-size: 15px;
	font-weight: 700;
	line-height: 22px;
	color: #000;
	margin-top: 30px;
	text-align: right
}

.benefitsimg {
	max-width: 100%;
	margin-bottom: -15px
}

.right-experts-row-title h2 {
	font-family: lato;
	color: #000639;
	font-size: 30px;
	font-weight: 600
}

.right-experts {
	padding: 0 0 100px
}

.right-experts-row-title {
	margin-bottom: 50px
}

.right-experts-row-title h2 {
	color: #000639
}

.no-gutters {
	margin-right: 0;
	margin-left: 0
}

.right-experts-tech {
	text-align: left
}

.right-experts-tech img.right-experts-tech-icon {
	max-height: 53px;
	width: auto;
	margin-bottom: 10px
}

.right-experts-tech h5 {
	font-size: 18px;
	font-family: lato;
	font-weight: 600;
	color: #000639;
	margin-bottom: 45px
}

ul.find-experts-tech-list {
	float: left;
	position: relative;
	width: 100%;
	margin: 0
}

ul.find-experts-tech-list li .find-experts-icon {
	width: 24px;
	height: auto;
	margin-right: 10px
}

ul.find-experts-tech-list li {
	float: left;
	position: relative;
	width: 100%;
	margin-bottom: 30px;
	color: #3c3c3c;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	font-size: 16px;
	text-align: left;
	height: 20 px;
	line-height: 20px
}

.hourly_main {
	padding: 0 50px 130px;
	min-height: 450px;
	background-position: center 130px;
	background-repeat: no-repeat;
	background-image: url(../images/uifstechnologies/hire_hours_back.jpg);
	background-size: cover
}

.hourly_box1 {
	background-color: #a71666;
	padding: 30px 50px;
	min-height: 450px;
	background-image: url(../images/uifstechnologies/hours_back1.png)
}

.hourly_main h1 {
	font-size: 42px;
	font-weight: 600;
	padding-bottom: 20px;
	color: #fff
}

.hourly_main p {
	font-size: 17px;
	font-weight: 100;
	color: #fff;
	padding-bottom: 10px
}

.hourly_box2 {
	background-color: #25b195;
	padding: 30px 50px;
	min-height: 450px;
	background-image: url(../images/uifstechnologies/hours_back2.png)
}

.hourly_box3 {
	background-color: #e4a000;
	padding: 30px 50px;
	min-height: 450px;
	background-image: url(../images/uifstechnologies/hours_back3.png)
}

.skyblue-bg {
	padding: 50px 0 50px;
	position: relative;
	z-index: 99
}

.psd-conversion .company-percentage ul {
	list-style: none;
	margin: 0 0 30px
}

.company-percentage li:first-child {
	border: none;
	padding: 3% 2% 3% 0
}

.company-percentage li {
	font-family: clear sans;
	font-size: 18px;
	font-weight: 500;
	color: #293a3e;
	display: inline-block;
	width: 24.5%;
	padding: 2% 1% 2% 3%;
	margin: 0;
	border-left: 1px solid #d0d0d0
}

.company-percentage i.team_icon_1 {
	width: 55px;
	height: 50px;
	float: left;
	margin: 0 10px 0 0;
	background: url(../images/uifstechnologies/hire_percentage_1.png) no-repeat
}

.company-percentage i.team_icon_2 {
	width: 55px;
	height: 50px;
	float: left;
	margin: 0 10px 0 0;
	background: url(../images/uifstechnologies/hire_percentage_2.png) no-repeat
}

.company-percentage i.team_icon_3 {
	width: 55px;
	height: 50px;
	float: left;
	margin: 0 10px 0 0;
	background: url(../images/uifstechnologies/hire_percentage_3.png) no-repeat
}

.company-percentage i.team_icon_4 {
	width: 55px;
	height: 50px;
	float: left;
	margin: 0 10px 0 0;
	background: url(../images/uifstechnologies/hire_percentage_4.png) no-repeat
}

.company-percentage li span {
	font-family: clear sans;
	font-size: 27px;
	font-weight: 600
}

.grey_pattern_top {
	background-image: url(../images/uifstechnologies/grey_pattern_top.png);
	background-repeat: no-repeat;
	min-height: 173px;
	background-size: cover
}

.grey_pattern_bottom {
	background-image: url(../images/uifstechnologies/grey_pattern_bottom.png);
	background-repeat: no-repeat;
	min-height: 173px;
	background-size: cover
}

.banner_hire_team {
	padding: 180px 0 200px;
	background-color: #242529;
	background-image: url(../images/uifstechnologies/hire_team_back.jpg)
}

.hire_team_title {
	font-family: lato;
	font-size: 100px;
	text-transform: uppercase;
	font-weight: 800;
	color: #fff;
	letter-spacing: 4px;
	line-height: 100px;
	background-clip: text;
	text-fill-color: transparent
}

.hire_team_title:after,
.hire_team_title:before {
	position: absolute;
	content: ''
}

.hire_team_para {
	font-family: lato;
	font-size: 24px;
	font-variant: small-caps;
	font-weight: 300;
	color: #fff;
	text-decoration: underline;
	padding-bottom: 20px
}

.hire_team_btn {
	font-size: 16px;
	font-weight: 300;
	color: #edeaea;
	border: 1px solid #311b74;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	margin-top: 20px;
	background: linear-gradient(to right, #e5422b 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.hire_team_btn:hover {
	background-position: left bottom;
	border: 1px solid #e5422b
}

.hire_dedicated {
	padding-left: 130px
}

.hire_dedicated_heading {
	font-family: lato;
	font-size: 40px;
	font-weight: 900;
	text-transform: uppercase
}

.hire_dedicated_para {
	padding-top: 20px;
	font-family: lato;
	font-size: 25px;
	line-height: 30px;
	font-weight: 600;
	color: #000;
	width: 85%
}

.Technologies {
	text-align: center;
	background-color: #242529;
	width: 100%;
	padding: 30px 0
}

.Technologies_title {
	font-family: lato;
	font-size: 40px;
	color: #fff;
	font-weight: 900;
	text-transform: uppercase
}

.Technologies_para {
	padding-top: 20px;
	font-family: lato;
	font-size: 17px;
	color: #8e8e8e;
	letter-spacing: 1px;
	line-height: 30px;
	font-weight: 400
}

.Technologies_para2 {
	position: absolute;
	left: -90px;
	padding-top: 20px;
	font-family: lato;
	font-size: 15px;
	color: #8e8e8e;
	letter-spacing: 1px;
	line-height: 30px;
	font-weight: 400;
	padding-bottom: 10px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease
}

.Technologies_table1:hover .Technologies_para2 {
	left: 30px
}

.Technologies_table {
	background-color: #242529;
	padding: 0 15%
}

.Technologies_table1 {
	border: 1px solid #35363b;
	padding: 30px;
	min-height: 230px;
	overflow: hidden
}

.Technologies_table1:hover .Technologies_icon {
	width: 200px;
	height: 150px
}

.Technologies_heading {
	font-size: 30px;
	color: #fff;
	font-weight: 400
}

.Technologies_icon {
	position: absolute;
	bottom: 5px;
	right: 5px;
	height: 100px;
	width: 150px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease
}

.Technologies_icon:hover {
	width: 220px;
	height: 147px
}

.Technologies_bottom {
	padding-top: 100px;
	background-color: #242529;
	padding-left: 80px;
	padding-bottom: 150px
}

.Technologies_bottom_title {
	font-family: lato;
	font-size: 60px;
	color: #fff;
	font-weight: 900
}

.Technologies_bottom_para {
	padding-top: 20px;
	font-family: lato;
	font-size: 18px;
	color: #fff;
	letter-spacing: 2px;
	line-height: 35px;
	font-weight: 400;
	width: 60%
}

.Technologies_bottom_para2 {
	padding-top: 50px;
	font-family: lato;
	font-size: 15px;
	letter-spacing: 2px;
	line-height: 35px;
	font-weight: 400;
	color: #8a8a8a
}

.popup_box {
	width: 40%;
	margin: 0 auto;
	background: rgba(255, 255, 255, .2);
	padding: 35px;
	border: 2px solid #fff;
	border-radius: 20px/50px;
	background-clip: padding-box;
	text-align: center
}

.overlay {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0, 0, 0, .7);
	transition: opacity .5s;
	visibility: hidden;
	opacity: 0;
	z-index: 999
}

.overlay:target {
	visibility: visible;
	opacity: 1
}

.popup h2 {
	margin-top: 0;
	color: #333;
	font-family: Tahoma, Arial, sans-serif
}

.popup .close {
	position: absolute;
	top: 0;
	right: 2%;
	transition: all .2s;
	font-size: 50px;
	font-weight: 700;
	text-decoration: none;
	color: #333;
	z-index: 999999
}

.popup .close:hover {
	color: #06d85f
}

.popup .content {
	max-height: 30%;
	overflow: auto
}

.popup {
	width: 700px;
	height: 550px;
	background-color: #f5f5f5;
	margin: 0 auto;
	border-radius: 5px;
	position: relative;
	top: 6%;
	padding-top: 10px
}

@media screen and (max-width:700px) {
	.popup_box {
		width: 70%
	}

	.popup {
		width: 70%
	}
}

.banner_about {
	background-image: url(../images/uifstechnologies/banner_about.jpg);
	background-repeat: no-repeat;
	min-height: 670px;
	background-color: #151759;
	transform: skewy(-2deg);
	background-size: cover
}

.dark_banner_blue {
	background-color: #151759
}

.about_banner_btn {
	background-color: #e22b13;
	padding: 10px 18px;
	border: none;
	color: #fff;
	font-family: clear sans;
	font-size: 16px;
	font-weight: 400;
	position: absolute;
	bottom: 27%;
	right: 39%;
	z-index: 999
}

.about_banner_btn:hover {
	background-color: #f34029;
	padding: 10px 18px;
	border: none;
	color: #fff;
	font-family: clear sans;
	font-size: 16px;
	font-weight: 400;
	position: absolute;
	bottom: 27%;
	right: 39%;
	z-index: 999
}

.banner_about_main {
	min-height: 718px;
	background-color: #151759;
	transform: skewy(2deg)
}

.floating {
	animation-name: floating;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	position: absolute;
	top: 100px;
	left: 8%;
	z-index: 998
}

@keyframes floating {
	from {
		transform: translate(0, 0)
	}

	65% {
		transform: translate(0, 15px)
	}

	to {
		transform: translate(0, 0)
	}
}

.video_about_main {
    background-image: url(../images/uifstechnologies/video_about.png);
    min-height: 450px;
    background-color: #1e2836;
    transform: skewy(2deg);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
}

.video_about {
	transform: skewy(-2deg)
}

.grey {
	background-color: #fff;
}

.we_are {
	padding: 150px;
	margin: 0 150px;
	font-size: 95px;
	color: #fff;
	font-weight: bolder;
	line-height: 110px
}

.video_about {
	transform: skewy(-2deg)
}

.white_space {
	min-height: 50px;
	background-color: #fff;
	transform: skewy(-2deg);
	position: relative;
	top: -28px
}

.white_space_main {
	min-height: 50px;
	background-color: #fff;
	position: relative;
	top: -28px
}

.team_title {
	text-transform: uppercase;
	font-size: 120px;
	padding-left: 80px;
	padding-right: 1000px;
	padding-bottom: 80px
}

.stats {
    min-height: 400px;
    background: linear-gradient(120deg,#060316 50%,#e5e5e5 49%);
}

.stats_grey {
	padding-top: 150px;
	padding-bottom: 150px;
	vertical-align: middle;
	background-color: #fff0;
}

.stats_blue {
	padding-top: 150px;
	padding-bottom: 150px;
	vertical-align: middle;
	background-color: #151759
}

.stats_white {
	padding-top: 150px;
	padding-bottom: 150px;
	vertical-align: middle;
	background-color: #fff0;
}

.stats_title {
	color: #e5e5e5;
	font-size: 110px;
	font-weight: 600
}

.stats_title_grey {
	color: #060316;
	font-size: 110px;
	font-weight: 600
}

.stats_title_blue {
	color: #fff;
	font-size: 110px;
	font-weight: 600
}

.stats_subtitle {
	color: #e5e5e5;
	font-size: 30px;
	font-weight: 600
}

.stats_subtitle_white {
	color: #060316;
	font-size: 30px;
	font-weight: 600
}

.pad-left-150 {
	padding-left: 150px
}

.pad-top-100 {
	padding-top: 100px
}

.journey {
	padding: 50px
}

.journey_title {
	font-size: 80px;
	color: #31313a
}

.journey_subtitle {
	font-size: 18px;
	font-weight: 600;
	color: #31313a;
	padding: 0 5px
}

.ending {
	color: #fff;
	padding-top: 50px;
	padding-bottom: 80px
}

.ending_title {
	color: #151759;
	font-size: 150px;
	font-weight: 600
}

.ending_title2 {
	color: #e5422b;
	font-size: 150px;
	font-weight: 600
}

.ending_subtitle {
	color: #3e3e3e;
	font-size: 40px;
	font-weight: 600;
	transition: .2s
}

.ending_subtitle:hover {
	color: #f7c115;
	font-size: 40px;
	font-weight: 600;
	transition: 1s;
	text-decoration: underline
}

#world {
	background: linear-gradient(#8ee4ae, #e9eba3);
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden
}

.validation_error {
	color: #d00808;
	position: relative;
	top: -50px
}

.gray_form_label {
	padding-bottom: 0;
	color: #aaaaab;
	font-size: 22px;
	font-family: lato;
	font-weight: 400
}

.gray_form_input {
	padding-bottom: 20px;
	color: #aaaaab;
	width: 80%;
	height: 55px;
	display: block;
	font-size: 20px;
	font-family: lato;
	font-weight: 400;
	letter-spacing: .4px;
	border-color: #4f5052;
	border-right: 1px solid #232427;
	border-left: 1px solid #232427;
	border-bottom: 1px solid #00c9d369;
	border-top: 1px solid #232427;
	padding: 0;
	border-radius: 0 !important;
	-webkit-appearance: none !important;
	background: 0 0;
	margin-bottom: 60px
}

textarea {
	min-height: 200px;
	border: 2px solid #c38d73;
	resize: none;
	line-height: 160%;
	padding: 30px;
	border-left: 1px solid #00c9d369 !important;
	border-right: 1px solid #00c9d369 !important;
	border-top: 1px solid #00c9d369 !important;
	margin-bottom: 20px !important
}

.gform_button {
	background: #00c9d3;
	color: #fff;
	text-align: left;
	border: none;
	padding: 20px 90px;
	font-size: 18px;
	float: right;
	transition: ease-in-out
}

.gform_button:hover {
	color: #e2bdab
}

.footer_button {
	width: 80%
}

.both_address {
	padding: 0 120px 0 90px
}

.gray_contact_form {
	background-color: #232427;
	padding: 100px 0
}

.ass {
	display: none;
	width: 200px;
	height: 200px;
	box-sizing: border-box;
	position: relative;
	background-color: #fff;
	border-radius: 5px;
	box-s hadow: 0 0 20px #d2d2d2;
	margin-bottom: 50px
}

.ass::after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	margin-left: -.5em;
	bottom: -19px;
	left: 50%;
	box-sizing: border-box;
	border: 10px solid #000;
	border-color: transparent transparent #fff #fff;
	transform-origin: 0 0;
	transform: rotate(-45deg);
	box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, .05)
}

.start_project {
	color: #232427;
	font-size: 24px;
	font-weight: 600;
	font-family: inherit;
	letter-spacing: 2px
}

.start_project:hover {
	color: #ebb318;
	font-size: 24px;
	font-weight: 600;
	font-family: inherit;
	text-decoration: underline !important;
	letter-spacing: 2.5px
}

.banner_contact_main img {
	height: 600px;
	background-size: cover;
	padding-top: 72px;
	margin-left: -15px;
	width: 90%
}

.telephone a {
	color: #337ab7
}

.telephone a:hover {
	color: #f6b138
}

.banner_contact_main {
	min-height: auto;
	background-color: #fff
}

.banner_contact {
	padding: 12% 12% 0 3%;
	color: #fff;
	position: inherit;
	z-index: 1
}

.contact_title {
	font-family: var(--font-secondary);
	font-size: 44px;
	color: #232427 !important;
	font-weight: 600
}

.banner_contact p {
	font-family: var(--font-secondary);
	font-size: 21px;
	letter-spacing: 1px;
	line-height: 35px;
	color: #7e7f80 !important;
	font-weight: 500;
	margin-top: 23px;
	padding-right: 50px
}

.contact_details_main {
	background-color: #fff;
	height: 100px;
	padding: 30px 0;
	transform-origin: left top;
	transform: skewy(0);
	border-bottom: 3px solid #85dd9f
}

.contact_details {
	background-color: #33484d;
	padding: 50px 100px 100px;
	margin-top: -50px
}

.contact_sec2_title {
	font-family: "Playfair Display", serif;
	font-size: 55px;
	line-height: 68px;
	font-weight: 600;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #fff070 0, #fff070 35%, #00c9d3 66%, #00c9d3 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite
}

.contact_sec2_title_hide {
	font-family: "Playfair Display", serif;
	font-size: 50px;
	line-height: 50px;
	font-weight: 600;
	padding-bottom: 20px;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #fff070 0, #fff070 35%, #00c9d3 66%, #00c9d3 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite
}

.contact_sec3_title {
	font-family: "Playfair Display", serif;
	font-size: 35px;
	text-decoration: underline !important;
	margin: 0;
	font-weight: 600;
	background-size: 200%;
	text-align: center
}

.contact_sec3_title a {
	font-size: 35px;
	color: #000;
	transition: 1s
}

.contact_sec3_title a:hover {
	font-size: 35px;
	letter-spacing: 1px;
	color: #00c9d3
}

.contact_dark_grey {
	color: #fff;
	font-size: 18px;
	font-family: clear sans;
	font-weight: 500;
	margin-top: 20px;
	margin-bottom: 0
}

.contact_light_grey {
	color: #d6d6d6;
	font-size: 18px;
	font-family: clear sans;
	font-weight: 300;
	line-height: 26px;
	margin-top: 0
}

.telephone h2 {
	margin-top: 0;
	padding-bottom: 0
}

.contact_btn {
	color: #fff;
	background-color: #1d1d1d;
	padding: 11px 20px;
	border: 1px solid #343434;
	margin-top: 20px
}

.contact_map {
	margin-top: 80px;
	padding: 0 50px
}

.contact_ending {
	color: #fff;
	padding-top: 50px;
	padding-bottom: 80px;
	background-color: #111
}

.contact_ending_title {
	color: #fff;
	font-size: 150px;
	font-weight: 600
}

.contact_ending_subtitle {
	color: #b6b6b6;
	font-size: 40px;
	font-weight: 300
}

#myVideo {
	position: absolute;
	right: 0;
	bottom: 0;
	min-width: 100%;
	min-height: 100%;
	background-color: #000;
	opacity: .4
}

a:focus {
	outline: 0
}

.portfolioFilter {
	padding: 15px 0
}

.portfolioFilter a {
	font-size: 16px;
	color: #666;
	text-decoration: none;
	padding: 4px 15px;
	display: inline-block;
	font-family: lato;
	font-weight: 500
}

.portfolioFilter a.current {
	color: #df422b
}

.portfolioContainer {
	border: 1px solid #eee;
	border-radius: 3px
}

.port_img {
	overflow: hidden;
	width: 100%;
	background-color: #000
}

.port_img img {
	margin: 0;
	width: 100%;
	transition: 2s
}

.port_img img:hover {
	transform: scale(1.2);
	cursor: pointer;
	opacity: .1
}

.isotope-item {
	z-index: 2
}

.isotope-hidden.isotope-item {
	pointer-events: none;
	z-index: 1
}

.isotope,
.isotope .isotope-item {
	-webkit-transition-duration: .8s;
	-moz-transition-duration: .8s;
	transition-duration: .8s
}

.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	transition-property: height, width
}

.isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	transition-property: transform, opacity
}

.portfolio_title_main {
	padding-bottom: 20px
}

.portfolio_title {
	font-size: 44px;
	color: #2a2e31;
	float: left;
	font-weight: 800;
	font-family: open sans
}

.portfolio_box {
	margin: 80px 0
}

.orange {
	color: #d82010
}

.our_work_ending_title {
	font-size: 18px;
	color: #fff;
	font-family: lato;
	font-weight: 500;
	padding-bottom: 50px
}

.our_work_ending_subtitle {
	font-size: 100px;
	color: #fff;
	font-family: lato;
	font-weight: 500
}

.our_work_ending_subtitle:hover {
	text-decoration: underline !important
}

.our_work_ending {
	background-color: #01083b;
	padding: 100px 0
}

.our_work_title {
	font-family: "Playfair Display", serif;
	font-size: 85px;
	font-weight: 600;
	width: 70% color: #fff;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #fff070 0, #fff070 35%, #00c9d3 66%, #00c9d3 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite
}

@keyframes glow {
	0% {
		background-position: 0 43%
	}

	50% {
		background-position: 100% 58%
	}

	100% {
		background-position: 0 43%
	}
}

.our_work_title1 {
	position: relative;
	font-family: fantasy;
	font-size: 100px;
	font-weight: 800;
	letter-spacing: 5px;
	color: #fff;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #fff070 0, #fff070 35%, #00c9d3 66%, #00c9d3 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite;
	transform: scale(1.3, 1)
}

@keyframes glow {
	0% {
		background-position: 0 43%
	}

	50% {
		background-position: 100% 58%
	}

	100% {
		background-position: 0 43%
	}
}

.our_work_para {
	font-family: lato;
	font-size: 14px;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #fff
}

.our_work_para_original {
	font-family: lato;
	font-size: 14px;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #fff
}

.banner_our_work {
	position: relative;
	min-height: 650px;
	background-color: #000;
	padding: 180px 0 80px;
	background-image: linear-gradient(to top, #030729 20%, #01083b 80%)
}

.banner_our_work_main {
	position: relative;
	background-color: #01083b
}

@keyframes move_wave {
	0% {
		transform: translateX(0) translateZ(0) scaleY(1)
	}

	50% {
		transform: translateX(-25%) translateZ(0) scaleY(.55)
	}

	100% {
		transform: translateX(-50%) translateZ(0) scaleY(1)
	}
}

.waveWrapper {
	overflow: hidden;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	margin: auto
}

.waveWrapperInner {
	position: absolute;
	width: 100%;
	overflow: hidden;
	height: 100%;
	bottom: -1px
}

.bgTop {
	z-index: 15;
	opacity: .5
}

.bgMiddle {
	z-index: 10;
	opacity: .75
}

.bgBottom {
	z-index: 5
}

.wave {
	position: absolute;
	left: 0;
	width: 200%;
	height: 100%;
	background-repeat: repeat no-repeat;
	background-position: 0 bottom;
	transform-origin: center bottom
}

.waveTop {
	background-size: 50% 100px
}

.waveAnimation .waveTop {
	animation: move-wave 3s;
	-webkit-animation: move-wave 3s;
	-webkit-animation-delay: 1s;
	animation-delay: 1s
}

.waveMiddle {
	background-size: 50% 120px
}

.waveAnimation .waveMiddle {
	animation: move_wave 10s linear infinite
}

.waveBottom {
	background-size: 50% 100px
}

.waveAnimation .waveBottom {
	animation: move_wave 15s linear infinite
}

.banner_ux_design_main {
	background-image: url(../images/uifstechnologies/banner_ux_design.gif);
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 650px;
	background-color: #151759
}

.banner_ux_design {
	padding-left: 9%;
	position: relative;
	padding-top: 27%
}

.ux_design_para {
	font-size: 18px;
	color: #fff;
	font-weight: 500;
	padding-top: 20px;
	width: 70%
}

.ux_design_take {
	font-family: lato;
	font-size: 80px;
	font-weight: lighter;
	color: #000841;
	padding-bottom: 20px;
	text-transform: uppercase;
	line-height: 85px;
	padding-right: 95px;
	text-align: right;
	padding-top: 120px
}

.bold_txt {
	font-weight: bolder
}

.ux_design_3boxes {
	background-repeat: no-repeat;
	padding: 120px 50px;
	background-size: cover
}

.ux_box1 {
	background-image: url(../images/uifstechnologies/box1.png);
	background-repeat: no-repeat;
	height: 450px;
	background-position: center !important;
    background-size: 100%;
    text-align: center;
    margin: auto;
}

.ux_box1:hover {
	background-image: url(../images/uifstechnologies/box1_hover.png);
}

.ux_box2 {
	background-image: url(../images/uifstechnologies/box2.png);
	background-repeat: no-repeat;
	padding: 0 20px;
	height: 450px;
	background-position: center !important;
    background-size: 100%;
    text-align: center;
    margin: auto;
}

.ux_box2:hover {
	background-image: url(../images/uifstechnologies/box2_hover.png);
}

.ux_box3 {
    background-image: url(../images/uifstechnologies/box3.png);
    background-repeat: no-repeat;
    height: 450px;
    background-position: center !important;
    background-size: 100%;
    text-align: center;
    margin: auto;
}

.ux_box3:hover {
	background-image: url(../images/uifstechnologies/box3_hover.png);
}

.ux_design_content {
	background-image: url(../images/uifstechnologies/ux_desigining_content_new.jpg);
	background-repeat: no-repeat;
	min-height: 1450px;
	background-size: cover
}

.logo_bounce {
	position: absolute;
	top: 1545px;
	right: 195px;
	animation-name: floating;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out
}

.ux_design_content_text {
	font-weight: 600;
	color: #020731;
	position: relative;
	top: 660px;
	left: 150px;
	font-size: 63px;
	text-align: left
}

.ux_design_stats {
	padding-left: 15px;
	border-left: 5px solid #0fe0b9;
	margin: 20px 0 20px
}

.ux_design_stats h1 {
	font-family: lato;
	font-weight: 400;
	font-size: 30px;
	margin: 0
}

.ux_design_stats p {
	padding-top: 10px;
	font-size: 16px;
	line-height: 18px
}

.ux_design_content_text_title {
	font-size: 70px;
	color: #020730
}

.banner_machine_main {
	background-image: url(../images/uifstechnologies/machine_learning_back.jpg);
	background-repeat: no-repeat;
	min-height: 700px;
	z-index: 3;
	background-size: cover
}

.banner_machine {
	padding: 15% 0 0 10%
}

.banner_machine h3 {
	font-family: quantify;
	font-size: 90px;
	color: #fff;
	font-weight: 600;
	letter-spacing: 1px;
	position: relative;
	z-index: 999999
}

.banner_machine h3::after {
	content: "";
	display: block;
	position: absolute;
	border-top: 3px solid #03bfff;
	width: 60px;
	margin-top: 10px;
	margin-bottom: 10px
}

.banner_machine p {
	font-family: clear sans;
	font-size: 17px;
	color: #fff;
	font-weight: 300;
	letter-spacing: 2px;
	padding-top: 22px;
	line-height: 30px;
	padding-right: 35%;
	position: absolute;
	z-index: 999
}

.banner_machine p::after {
	content: "";
	display: block;
	border: 6px solid #e4422b;
	width: 329px;
	height: 360px;
	background-color: transparent;
	margin-top: -320px;
	margin-left: 70px
}

.machine_learning_section2 {
	background-image: url(../images/uifstechnologies/machine_learning_section2_back.jpg);
	background-repeat: no-repeat;
	paddi ng: 80px 30px
}

.machine_learning_section2 h1 {
	font-family: clear sans;
	font-weight: 600;
	font-size: 40px;
	color: #33383d;
	letter-spacing: 1px;
	padding-bottom: 60px
}

.machine_learning_section2_box1 {
	background-color: #fff;
	text-align: left;
	padding: 50px 35px;
	margin-top: 60px;
	box-shadow: 0 0 20px #dadada;
	transition: 1s
}

.machine_learning_section2_box1:hover {
	background-color: #fff;
	text-align: left;
	padding: 50px 35px;
	margin-top: 40px;
	box-shadow: 0 0 20px #dadada;
	transform: rotate(-5deg)
}

.machine_learning_section2_box1 h1 {
	font-family: clear sans;
	font-weight: 600;
	font-size: 22px;
	color: #343434;
	padding-bottom: 12px
}

.machine_learning_section2_box1 p {
	font-family: clear sans;
	font-weight: 400;
	font-size: 15px;
	color: #9c9c9c;
	padding-bottom: 12px
}

.machine_learning_section2_box2 {
	background-color: #fff;
	text-align: left;
	padding: 50px 35px;
	box-shadow: 0 0 20px #dadada;
	transition: 1s
}

.machine_learning_section2_box2:hover {
	margin-top: 0;
	transform: rotate(5deg)
}

.machine_learning_section2_box2 h1 {
	font-family: clear sans;
	font-weight: 600;
	font-size: 22px;
	color: #343434;
	padding-bottom: 12px
}

.machine_learning_section2_box2 p {
	font-family: clear sans;
	font-weight: 400;
	font-size: 15px;
	color: #9c9c9c;
	padding-bottom: 12px
}

.machine_section3 {
	padding: 3% 7% 6%
}

.machine_section3 h1 {
	font-family: clear sans;
	color: #07121e;
	font-size: 45px
}

.machine_section3 h4 {
	line-height: 34px;
	font-family: lato;
	font-size: 22px;
	padding-right: 5%
}

.machine_section3 p {
	font-family: clear sans;
	color: #07121e;
	font-size: 16px;
	line-height: 30px;
	padding: 20px 0
}

.machine_section4 {
	padding: 6% 7% 2%;
	background-color: #f6fafe
}

.machine_section4 h1 {
	font-family: clear sans;
	color: #07121e;
	font-size: 45px
}

.machine_section4 p {
	font-family: clear sans;
	color: #07121e;
	font-size: 16px;
	line-height: 30px;
	padding: 20px 0
}

.machine_section6 {
	padding: 4% 7%
}

.machine_section6 h1 {
	font-family: clear sans;
	color: #fff;
	font-size: 45px;
	padding-top: 5%
}

.machine_section6 p {
	font-family: clear sans;
	color: #fff;
	font-size: 18px;
	line-height: 24px;
	padding: 0 0 20px
}

.blue_background {
	background-color: #00074c
}

.machine_section6_1 {
	padding: 20px;
	float: left
}

.machine_section6_1 img {
	width: 100%
}

.machine_section6_2 {
	margin-top: 40px;
	padding: 20px;
	float: left
}

.machine_section6_2 img {
	width: 100%
}

.machine_section6_2 h1 {
	text-align: center;
	font-family: clear sans;
	font-weight: 700;
	color: #fff;
	font-size: 20px
}

.machine_section6_2 p {
	text-align: center;
	font-family: clear sans;
	font-weight: 400;
	color: #fff;
	font-size: 18px;
	font-style: italic;
	padding: 0
}

.machine_section6_1 h1 {
	text-align: center;
	font-family: clear sans;
	font-weight: 700;
	color: #fff;
	font-size: 20px
}

.machine_section6_1 p {
	text-align: center;
	font-family: clear sans;
	font-weight: 400;
	color: #fff;
	font-size: 18px;
	font-style: italic;
	padding: 0
}

.banner_seo_main {
	background-image: url(../images/uifstechnologies/seo_banner_back1.jpg);
	background-repeat: no-repeat;
	min-height: 830px;
	background-size: cover
}

.banner_seo {
	padding-top: 200px;
	padding-left: 100px
}

.banner_seo p {
	font-family: lato;
	font-weight: 300;
	font-size: 24px;
	color: #fff;
	padding-left: 10px;
	padding-bottom: 20px
}

.seo_sec2 {
	padding-right: 150px;
	padding-top: 100px;
	text-align: right
}

.seo_sec3_main {
	margin-top: 100px
}

.seo_sec3 {
	padding-left: 150px;
	padding-top: 50px;
	text-align: left
}

.seo_sec2_title {
	font-family: lato;
	font-size: 44px;
	color: #07121e;
	text-align: right;
	padding-bottom: 30px
}

.seo_sec2 p {
	font-family: lato;
	font-size: 18px;
	color: #07121e;
	text-align: right;
	padding-bottom: 20px
}

.seo_sec3 p {
	font-family: lato;
	font-size: 18px;
	color: #07121e;
	text-align: left;
	padding-bottom: 20px
}

.some_words p {
	width: 60%;
	margin: 0 auto;
	font-size: 15px;
	padding: 10px
}

.seo_sec2_btn {
	float: right;
	font-size: 16px;
	font-weight: 300;
	color: #07121e;
	border: 1px solid #87898d;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	display: block;
	background: linear-gradient(to right, #e5422b 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: all .3s ease-out
}

.seo_sec2_btn:hover {
	float: right;
	font-size: 16px;
	font-weight: 300;
	color: #fff;
	border: 1px solid #87898d;
	border-radius: 25px;
	background-color: transparent;
	padding: 12px 40px;
	display: block;
	background: linear-gradient(to right, #e5422b 50%, transparent 50%);
	background-size: 200% 100%;
	background-position: left bottom;
	transition: all .3s ease-out
}

.seo_sec3_title {
	font-family: lato;
	font-size: 44px;
	color: #07121e;
	text-align: left;
	padding-bottom: 30px
}

.seo_why_main {
	background-image: url(../images/uifstechnologies/why_ucodice_back.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0 7%
}

.seo_why {
	background-color: #fff;
	border-radius: 5px;
	border: 1px solid #fff;
	padding: 65px 50px;
	margin: 245px 0 105px 0;
	box-shadow: 0 0 46px -27px
}

.seo_why_small {
	padding: 0 40px
}

.seo_why_title {
	font-size: 22px;
	color: #5a4466
}

.seo_why p {
	font-family: lato;
	font-size: 17px;
	color: #8f8e8f;
	font-weight: 400;
	line-height: 24px
}

.ending2 {
	margin-bottom: 100px
}

.ending2_title {
	font-family: lato;
	color: #494141;
	font-size: 100px;
	font-weight: 900
}

.ending2_subtitle {
	overflow: hidden;
	height: 220px
}

.ending2_subtitle p {
	font-family: lato;
	color: #ebac9a;
	font-size: 110px;
	font-weight: 900;
	line-height: 115px
}

.banner_web_dev_main {
	background-image: url(../images/uifstechnologies/banner_web_dev.jpg);
	background-repeat: no-repeat;
	min-height: 650px;
	background-color: #010224;
	animation: banner_web_dev 120s linear infinite
}

@keyframes banner_web_dev {
	0% {
		background-position: 0 0
	}

	50% {
		background-position: 100% 0
	}

	100% {
		background-position: 0 0
	}
}

.banner_web_dev {
	left: 10%;
	position: absolute;
	top: 25%
}

.web_dev_title {
	font-family: "Playfair Display", serif;
	font-size: 85px;
	line-height: 90px;
	font-weight: 600;
	background-size: 200%;
	background-image: none;
	background-image: linear-gradient(45deg, #fff070 0, #fff070 35%, #00c9d3 66%, #00c9d3 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: glow 9s linear infinite
}

@keyframes glow {
	0% {
		background-position: 0 43%
	}

	50% {
		background-position: 100% 58%
	}

	100% {
		background-position: 0 43%
	}
}

.web_dev_content_main {
	background-color: #140f21;
	width: 100%;
	padding-bottom: 100px;
	background-image: url(../images/uifstechnologies/skills-bg.jpg);
	background-size: cover;
	background-position: center bottom
}

.web_dev_content {
	text-align: center;
	width: 100%;
	padding: 7% 20% 0 20%
}

.web_dev_served {
	text-align: center;
	width: 100%;
	background-color: #eef3f7;
	padding-bottom: 3%
}

.web_dev_served_heading {
	text-align: center;
	width: 100%;
	padding: 4% 20% 1% 20%;
	background-color: #eef3f7
}

.color-white {
	color: #fff !important
}

.cms_text {
	padding-right: 150px;
	text-align: right
}

.cms_text p {
	font-family: clear sans;
	font-weight: 400;
	font-size: 18px;
	line-height: 28px
}

.website_development_text {
	padding-left: 150px;
	text-align: left
}

.website_development_text p {
	font-family: clear sans;
	font-weight: 400;
	font-size: 18px;
	line-height: 28px
}

.web_dev_content_title {
	font-family: clear sans;
	color: #fff;
	margin-bottom: 50px;
	font-weight: 400;
	position: relative;
	max-width: 700px;
	width: 100%;
	line-height: 150%;
	font-size: 32px;
	text-align: left
}

.web_dev_content_title::before {
	content: "";
	position: absolute;
	top: 25px;
	left: -75px;
	width: 60px;
	height: 3px;
	background: #fff
}

.web_dev_served_title {
	font-family: clear sans;
	color: #2b2c4a;
	margin-bottom: 50px;
	font-weight: 700;
	position: relative;
	max-width: 700px;
	width: 100%;
	line-height: 150%;
	font-size: 48px;
	text-align: left
}

.web_dev_served_title::before {
	content: "";
	position: absolute;
	top: 40px;
	left: -75px;
	width: 60px;
	height: 5px;
	background: #2b2c4a
}

.web_development_tech {
	padding: 3% 15%;
	text-align: center
}

.served_boxes {
	padding: 0 6% 3% 6%
}

.box_up h5,
.box_up1 h5 {
	color: #3f3b3c;
	font-size: 18px;
	padding: 0;
	margin: 0
}

.box_up {
	width: 100%;
	height: 150px;
	color: #3f3b3c;
	border-radius: 6px;
	border: 1px solid #fff;
	background-color: #fff;
	box-shadow: 3px 3px 15px -5px;
	margin-bottom: 30px;
	padding: 10px;
	font-size: 18px;
	transition: transform 1s
}

.box_up:hover {
	transform: rotate(15deg)
}

.box_up img {
	transition: transform 1s
}

.box_up img:hover {
	transform: scale(1.1);
	transform: rotate(-15deg)
}

.box_up1 {
	width: 100%;
	height: 150px;
	color: #3f3b3c;
	border-radius: 6px;
	border: 1px solid #fff;
	background-color: #fff;
	box-shadow: 3px 3px 15px -5px;
	margin-bottom: 30px;
	padding: 10px;
	margin-top: 20px;
	font-size: 18px;
	transition: transform 1s
}

.box_up1:hover {
	transform: rotate(15deg)
}

.box_up1 img {
	transition: transform 1s
}

.box_up1 img:hover {
	transform: scale(1.1);
	transform: rotate(-15deg)
}

.box_up_left {
	width: 100%;
	height: 150px;
	color: #3f3b3c;
	border-radius: 6px;
	border: 1px solid #fff;
	background-color: #fff;
	box-shadow: 3px 3px 15px -5px;
	margin-bottom: 30px;
	padding: 10px;
	font-size: 18px;
	transform: rotate(8deg) !important;
	transition: transform 1s !important
}

.box_up_left:hover {
	transform: rotate(0)
}

.leaf-orange {
	position: absolute;
	top: 34%;
	right: 56%
}

.web_dev_side_img {
	position: absolute;
	right: 5%;
	top: 10%;
	animation-name: floating;
	animation-duration: 8s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out
}

.blog_big {
	position: relative;
	height: 447px;
	margin-top: 25px;
	padding: 50px 60px
}

.blog_big img {
	position: absolute;
	top: 0;
	left: 0;
	overflow: visible
}

.blog_big h3 {
	background-color: #e5422b;
	font-family: clear sans;
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	padding: 5px;
	position: relative;
	display: table-cell
}

.blog_big p {
	font-family: clear sans;
	font-weight: 400;
	font-size: 39px;
	color: #fff;
	padding-top: 35px;
	position: relative;
	padding-right: 10%;
	line-height: 40px
}

.blog_big a {
	position: relative
}

.blog_small {
	position: relative;
	margin-top: 25px;
	padding-left: 0
}

.blog_small h3 {
	background-color: #e5422b;
	font-family: clear sans;
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	padding: 5px;
	position: absolute;
	top: 10px;
	left: 20px;
	display: table-cell
}

.blog_small p {
	font-family: clear sans;
	font-weight: 400;
	font-size: 18px;
	color: #fff;
	padding: 5px;
	position: absolute;
	top: 60px;
	left: 15px;
	padding-right: 30%
}

.blog_small a {
	position: absolute;
	top: 160px;
	right: 40px
}

.blog_small_left {
	position: relative;
	margin-top: 25px
}

.blog_small_left h3 {
	background-color: #e5422b;
	font-family: clear sans;
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	padding: 5px;
	position: absolute;
	top: 10px;
	left: 20px;
	display: table-cell
}

.blog_small_left p {
	font-family: clear sans;
	font-weight: 400;
	font-size: 18px;
	color: #fff;
	padding: 5px;
	position: absolute;
	top: 60px;
	left: 15px;
	padding-right: 30%
}

.blog_small_left a {
	position: absolute;
	top: 160px;
	right: 40px
}

.blog_main {
	background-color: #080816;
	padding-top: 100px;
	padding-bottom: 100px;
	padding-left: 5%;
	padding-right: 5%
}

.blog_main_left {
	margin-top: 80px
}

.blog1 {
	margin-top: 80px
}

.blog1 h1 {
	font-size: 45px;
	font-family: alef;
	font-weight: 600;
	color: #f99314
}

.blog1 p {
	font-size: 18px !important;
	font-family: alef;
	font-weight: 100;
	color: #97979c !important;
	line-height: 28px !important;
	padding-top: 20px;
	text-align: justify
}

.blog1 ul {
	padding-top: 50px;
	padding-left: 20px
}

.blog1 ul li {
	list-style: square;
	font-size: 18px;
	font-family: alef;
	color: #76767d;
	padding-bottom: 20px;
	text-align: justify;
	padding-left: 10px
}

.blog_h_line {
	width: 100%;
	height: 1px;
	background-color: #121227;
	margin: 15px 0 50px
}

.breadcum a {
	color: #888;
	font-size: 14px
}

.breadcum a:hover {
	color: #f99314;
	text-decoration: underline !important
}

.breacum_select {
	color: #b9b9b9 !important
}

.breacum_select:hover {
	color: #f99314 !important
}

.blogs_para_bold {
	font-weight: 700;
	color: #f99314
}

.skills_projects_box_up h5 {
	color: #3f3b3c;
	font-size: 24px;
	padding-top: 13px;
	margin: 0
}

.skills_projects_box_up {
	width: 100%;
	height: 280px;
	color: #3f3b3c;
	border-radius: 6px;
	border: 1px solid #fff;
	background-color: #fff;
	box-shadow: 3px 3px 15px -5px;
	margin-bottom: 30px;
	padding: 10px;
	font-size: 18px;
	transition: transform 1s
}

.skills_projects_box_up:hover {
	transform: rotate(15deg)
}

.skills_projects_box_up img {
	transition: transform 1s;
	width: 100%;
	height: 215px
}

.comment-block_main h1 {
	font-size: 36px;
	background-color: #f4f4f4;
	width: 64%;
	margin: 0 auto;
	padding: 70px 0 40px
}

.comment_block .create_new_comment .input_comment {
	display: inline-block;
	vertical-align: middle;
	margin-left: 10px;
	width: calc(100% - 75px)
}

.comment-block_main {
	background-color: #f4f4f4
}

.comment_block .create_new_comment .input_comment {
	display: inline-block;
	vertical-align: middle;
	margin-left: 10px;
	width: calc(100% - 75px)
}

.comment_block .new_comment .comment_body {
	display: inline-block;
	vertical-align: middle;
	width: calc(100% - 75px);
	min-height: 65px;
	margin-left: 10px;
	padding: 5px 10px;
	font-size: .9rem;
	color: #555;
	background-color: #fff;
	border-bottom: 2px solid #f2f2f2
}

.comment_block .create_new_comment .input_comment input[type=text] {
	width: 100%;
	font-family: Lato, sans-serif;
	font-weight: 300;
	font-size: 20px;
	padding: 10px;
	margin-left: 10px;
	border: none;
	border-bottom: 2px solid #f2f2f2
}

.comment_block .create_new_comment {
	padding: 20px 0
}

.comment_block .new_comment {
	width: 100%;
	height: auto;
	padding: 20px 0;
	border-top: 1px solid #e6e6e6
}

.comment_block .new_comment .user_comment {
	list-style-type: none
}

.user_avatar {
	width: 65px;
	height: 65px;
	display: inline-block;
	vertical-align: middle;
	height: 100%;
	border-radius: 50%
}

.comment_block .new_comment .comment_body {
	display: inline-block;
	vertical-align: middle;
	width: calc(100% - 75px);
	min-height: 65px;
	margin-left: 10px;
	padding: 5px 10px;
	font-size: .9rem;
	color: #555;
	background-color: #fff;
	border-bottom: 2px solid #f2f2f2
}

.comment_block .new_comment .comment_body {
	display: inline-block;
	vertical-align: middle;
	width: calc(100% - 75px);
	min-height: 65px;
	margin-left: 10px;
	padding: 5px 10px;
	font-size: 16px;
	color: #555;
	background-color: #fff;
	border-bottom: 2px solid #f2f2f2
}

.comment_block .new_comment .comment_toolbar {
	width: 100%
}

.comment_block .new_comment .comment_toolbar .comment_details {
	display: inline-block;
	vertical-align: middle;
	width: 70%;
	text-align: left
}

.comment_block .new_comment .comment_toolbar ul {
	list-style-type: none;
	padding-left: 75px;
	font-size: 0
}

.comment_block .new_comment .comment_toolbar ul li {
	display: inline-block;
	padding: 5px;
	font-size: 1.1rem;
	color: #d9d9d9
}

.comment_block .new_comment .comment_toolbar ul {
	list-style-type: none;
	padding-left: 75px;
	font-size: 0
}

*,
:after,
:before {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	transition: all .2s ease
}

.fa {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.fa-clock-o:before {
	content: "\f017"
}

.comment_block .new_comment .comment_toolbar .comment_tools {
	display: inline-block;
	vertical-align: middle;
	width: 30%;
	text-align: right
}

.comment_block {
	width: 65%;
	height: 100%;
	margin: 0 auto;
	padding: 10px
}

.create_new_comment {
	width: 100%;
	padding: 20px 0;
	vertical-align: middle;
	margin-left: 10px;
	width: calc(100% - 75px)
}

input[type=text] {
	width: 100%;
	font-family: $LATO;
	font-weight: 300;
	font-size: 1.3rem;
	padding: 10px;
	border: none;
	border-bottom: 2px solid lighten($GREY, 15%)
}

&:focus {
	outline: 0;
	border-bottom: 2px solid lighten($GREY, 10%)
}

.comment_body {
	display: inline-block;
	vertical-align: middle;
	width: calc(100% - 75px);
	min-height: 65px;
	margin-left: 10px;
	padding: 5px 10px;
	font-size: .9rem;
	color: #555;
	background-color: $WHITE;
	border-bottom: 2px solid lighten($GREY, 15%);
	background-color: lighten($GREY, 18%);
	border-bottom: 2px solid lighten($GREY, 15%);
	border-radius: 5px
}

span {
	color: $BLUE;
	margin-right: 2px
}

.comment_tools {
	display: inline-block;
	vertical-align: middle;
	width: 30%;
	text-align: right
}

.image-slider__slide-overlay {
	position: absolute;
	mix-blend-mode: multiply;
	-webkit-transition: all .4s ease-in-out 0s;
	transition: all .4s ease-in-out 0s;
	left: 0;
	bottom: 0;
	right: 0;
	top: 0;
	background-color: #00adb1;
	opacity: 0
}

.image-slider__slide:hover .image-slider__slide-overlay {
	opacity: 1
}

.home_work_section_left img {
	width: 100%;
	margin-right: 50px
}

.home_work_section img {
	width: 100%
}

.home_work_section_left {
	background-color: #000
}

.home_work_section_right {
	padding-top: 170px
}

.home_about_section {
	background-color: #0d0b0b
}

.aaaaa {
	position: absolute;
	top: 28%;
	left: 37%
}

a:active,
a:hover {
	outline: 0
}

a:focus,
a:hover {
	color: #23527c
}

*,
:after,
:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}

.video_over {
	background-image: url(../images/video_over.png);
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover
}

.width_100 {
	width: 100% !important
}

.pad_0 {
	padding: 0 !important
}

#wrap {
	position: relative;
	width: 100%;
	overflow: hidden
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 400;
	color: #141414;
	font-family: Montserrat, sans-serif;
	font-weight: 700
}

h1 {
	font-size: 42px
}

h2 {
	font-size: 36px;
	font-weight: 700
}

h3 {
	font-size: 30px
}

h4 {
	font-size: 24px
}

h5 {
	font-size: 18px
}

h6 {
	font-size: 14px;
	font-weight: 700
}

a {
	text-decoration: none !important;
	font-family: Montserrat, sans-serif
}

ul {
	margin-bottom: 0
}

li {
	list-style: none
}

a {
	text-decoration: none;
	color: #141414
}

p.intro-small {
	font-style: italic;
	color: #f5f5f5;
	width: 80%;
	margin: 0 auto
}

section {
	position: relative;
	overflow: hidden;
	width: 100%;
	background: #fff
}

@media only screen and (min-width:1041px) and (max-width:1185px) {
	.agency {
		font-size: 83pt !important
	}

	#who-we-are {
		font-size: 35pt !important
	}
}

@media only screen and (min-width:768px) and (max-width:991px) {
	.hero_service_main {
		bottom: -436px
	}

	.ux_design_para {
		padding-top: 18%
	}

	.agency {
		right: 0 !important
	}
}

@media only screen and (min-width:0px) and (max-width:954px) {
	.ux_design_para {
		padding-top: 18%
	}
}

@media only screen and (min-width:0px) and (max-width:954px) {
	.ux_design_para {
		padding-top: 18%
	}
}

.agency {
	font-size: 84pt;
	color: #3e3f3f;
	font-weight: 900;
	letter-spacing: -12px;
	position: relative;
	z-index: .5;
	right: 21px;
	opacity: .5
}

.arrow {
	width: 233px;
	margin-top: 14%
}

.line {
	margin-top: 14px;
	width: 220px;
	background: #fff;
	height: 2px;
	float: left
}

.point {
	width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	border-left: 13px solid #fff;
	float: right;
	position: relative;
	top: 7px
}

.about-use-description {
	padding-right: 14%
}

#about-desc {
	position: relative;
	top: -37px
}

.video-opacity {
	opacity: .9;
	width: 100%;
	background: #0f1010;
	position: absolute;
	top: 0;
	height: 100%
}

#mob-read {
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	border: 2px solid;
	display: none !important
}

.mob-about {
	padding-left: 41%;
	padding-right: 44%
}

@media only screen and (min-width:0px) and (max-width:370px) {
	.home_video_banner_text ul li {
		font-size: 13px
	}

	.mob-about {
		padding-left: 31%;
		padding-right: 37%
	}
}

@media only screen and (min-width:371px) and (max-width:415px) {
	#about-desc {
		top: -2px !important
	}

	.home_video_banner_text ul li {
		font-size: 18px
	}
}

#video_slider {
	display: flex;
	position: relative;
	flex-direction: column;
	width: 100vw;
	height: 100vh
}

.home_about_section {
	background-color: #0d0b0b
}

.location_box1,
.location_box2 {
	background-size: 100%
}

@media only screen and (min-width:768px) and (max-width:1148px) {
	.upper_footer_img {
		margin: 0 65px;
		background-size: 100%
	}
}

.testimonial-view-all {
	margin-top: 110px !important;
	text-align: center !important
}

@media only screen and (min-width:768px) and (max-width:812px) {
	.testimonial-view-all {
		margin-top: 0 !important
	}
}

@media only screen and (min-device-width:1025px) and (max-device-width:1133px) and (orientation:landscape) {
	#wide_menu {
		display: flex
	}
}

@media only screen and (min-device-width:1025px) and (max-device-width:1199px) and (orientation:landscape) {

	.location_box1,
	.location_box1:hover,
	.location_box2,
	.location_box2:hover {
		background-size: 100% 100%
	}
}

@media only screen and (max-width:1024px) and (min-width:992px) and (orientation:landscape) {

	.location_box1,
	.location_box2 {
		background-size: 100% 98% !important
	}

	.location_box1 img,
	.location_box2 img {
		padding-top: 0 !important
	}
}

.l-left a img {
	width: 100px;
}

.sec2_services .in-view:hover {
	box-shadow: rgb(255 255 255 / 35%) 0px 5px 15px;
}

.sec2_services .in-view:hover .services_icon.text-center {
	background: #fff;
}
.center-content {
    display: flex;
    align-items: center;
}
.padding-fixed{
        padding: 10rem 0 4rem 0;
            width: 100%;
}
.banner_services-ul {
    color: #fff;
    text-align: left;
    font-size: 18px;
}
.banner_services-ul li i {
    margin-right: 5px;
    color: #ffad02;
}
.services_icon img {
    width: 100%;
    border-radius: 50%;
    margin-top: -3px;
}
@media screen and (min-device-width: 320px) and (max-device-width: 768px) { 
.center-content {
    display: block;
    align-items: center;
}
.banner_services h5 {
    font-size: 52px;
}
}
.mobile_app_sec1 img {
    width: 50%;
}
.mobile_app_sec2_img {
    text-align: center;
}
.mobile_app_sec2_img img {
    width:62%;
}
.seo_sec2-desc {
    text-align: center;
}
.seo_sec2-desc img {
    width: 50%;
}
.image-section img {
    width:100%;
}
.banner_services.banner_services_company {
    width: 80%;
}
.padding-fixed {
    padding: 10rem 0 0rem 0 !important;
}
.banner_services.banner_services_company h4 {
    color: #ffffff;
    font-family: clear sans;
    font-size: 22px;
    font-weight: 400;
    line-height: 34px;
    text-align: left;
}
.cd-nav-trigger.js-cd-nav-trigger.text-replace {
    background: #000;
}
.carousel-inner>.item>img, .carousel-inner>.item>a>img {
    line-height: 1;
    object-fit: cover;
}
.slider-over-content h2 span {
    color: #000 !important;
}
.text-left.user-name {
    font-size: 14px;
}
.sector-2-about-card-1 p, .sector-2-about-card-2 p, .sector-2-about-card-3 p, .sector-2-about-card-4 p {
    font-size: 18px !important;
    text-align: left !important;
}
.sector-2-about-card-1 h5, .sector-2-about-card-2 h5, .sector-2-about-card-3 h5, .sector-2-about-card-4 h5 {
    font-size: 22px !important;
}
.sector-2-about-card-1, .sector-2-about-card-2, .sector-2-about-card-3, .sector-2-about-card-4 {
    padding: 18px !important;
    word-spacing: 0px;
    letter-spacing: 0px;
    border-radius: 8px;
    box-shadow: rgb(0 255 220) 0px 5px 15px;
}
.sector-2-about-card-1 {
    background: #00ffdc !important;
}
.why-us {
    margin-bottom: 4rem;
}
.why-us h1 {
    font-size: 72px !important;
    letter-spacing: 4px !important;
}
.why-us-desc {
    padding-top: 22px !important;
}
.floating img {
    max-width: 375px;
    width: 100%;
}
/**/

