﻿/* The Loader */
#logo {
	width:160px !important;
	height:31px !important;
}
.spinner {
	position: absolute;
	width: 27px;
	height: 64px;
	border-radius: 50px;
	top: calc(50% - 13px);
	left: calc(50% - 13px);
	z-index:999;
}

.preloaderLogo {
	position: absolute;
	top: 26%;
	left:-1%;
	content: "";
	/* opacity: 0.5; */
}
.spinner:after {
    content: "";
    position: absolute;
    width: 105px;
    height: 105px;
    top: -19px;
    left: -38px;
    border-top: 2px solid #4e68f0;
    border-bottom: 2px solid #a93bff;
    border-left: 2px solid #a93bff;
    border-right: 0px solid #a93bff;
    border-radius: 100%;
    animation: preloader_5_after 1.5s infinite linear;
}
@keyframes preloader_5 {
    0% {transform: rotate(0deg);}
    50% {transform: rotate(180deg);}
    100% {transform: rotate(360deg);}
}
@keyframes preloader_5_after {
    0% {border-top:2px solid #4e68f0;border-bottom:2px solid #4e68f0; transform: rotate(0deg);}
    50% {border-top:2px solid #4e68f0;border-bottom:2px solid #4e68f0; transform: rotate(180deg);}
    100% {border-top:2px solid #4e68f0;border-bottom:2px solid #4e68f0; transform: rotate(360deg);}
}
#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    overflow: hidden;
}

.no-js #loader-wrapper {
    display: none;
}

#loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #16a085;
    -webkit-animation: spin 1.7s linear infinite;
    animation: spin 1.7s linear infinite;
    z-index: 11;
}

#loader:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #e74c3c;
    -webkit-animation: spin-reverse .6s linear infinite;
    animation: spin-reverse .6s linear infinite;
}

#loader:after {
    content: "";
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #f9c922;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spin-reverse {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
    }
}

@keyframes spin-reverse {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg);
    }
}

#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #1e232c;
    z-index: 10;
}

#loader-wrapper .loader-section.section-left {
    left: 0;
}

#loader-wrapper .loader-section.section-right {
    right: 0;
}

/* Loaded styles */
.loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.loaded #loader, .loaded .spinner {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.loaded #loader-wrapper {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all 0.3s 1s ease-out;
    transition: all 0.3s 1s ease-out;
}

#preloader {
    position: relative;
    width: 80px;
    height: 80px;
    top: 45%;
    margin: 0 auto;
}

#preloader span {
    position: absolute;
    border: 8px solid #ffe066;
    border-top: 8px solid transparent;
    border-radius: 999px;
}

#preloader span:nth-child(1) {
    width: 80px;
    height: 80px;
    animation: spin-1 2s infinite linear;
}

#preloader span:nth-child(2) {
    top: 20px;
    left: 20px;
    width: 40px;
    height: 40px;
    animation: spin-2 1s infinite linear;
}

@keyframes spin-1 {
    0% {
        transform: rotate(360deg);
        opacity: 1;
    }
    50% {
        transform: rotate(180deg);
        opacity: 0.5;
    }
    100% {
        transform: rotate(0deg);
        opacity: 1;
    }
}

@keyframes spin-2 {
    0% {
        transform: rotate(0deg);
        opacity: 0.5;
    }
    50% {
        transform: rotate(180deg);
        opacity: 1;
    }
    100% {
        transform: rotate(360deg);
        opacity: 0.5;
    }
}

/*SECTION-NAVIGATION*/

html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}

.section-auto-height {
    position: relative;
    transition: all 0.4s ease 0s;
}

.section-top {
    padding: 20px;
    z-index: 9;
    position: relative;
}

.main-nav {
    display: block;
    text-align: center;
}

.main-nav .navbar-default {
    background: none;
    padding: 0px;
}

.main-nav .navbar-collapse {
    padding: 0px;
}

.main-nav .navbar-default ul > li {
    display: inline-block;
    margin: 0px 18px;
}

.main-nav .navbar-default ul > li > a {
    color: #323435;
    display: block;
    padding: 7px 0;
    text-transform: uppercase;
    font-family: 'Stolzl Medium';
    position: relative;
}

.main-nav .navbar-default ul > li > a:hover::after, .main-nav .navbar-default ul > li > a:hover::before, .overlay ul li a:hover::after, .overlay ul li a:hover::before, .top-right ul li a:hover::after, .top-right ul li a:hover::before {
    left: 0;
    width: 100%;
}

.main-nav .navbar-default ul > li > a::before, .overlay ul li a::before, .top-right ul li a::before {
    background-color: #A63BFE;
    transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;
    -moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;
    -webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;
}

.main-nav .navbar-default ul > li > a::after, .overlay ul li a::after, .top-right ul li a::after {
    background-color:#5165F1;
    transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;
    -moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;
    -webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;
}

.main-nav .navbar-default ul > li > a::after, .main-nav .navbar-default ul > li > a::before, .overlay ul li a::after, .overlay ul li a::before, .top-right ul li a::before, .top-right ul li a::after {
    bottom: -2px;
    content: "";
    height: 3px;
    left: auto;
    position: absolute;
    right: 0;
    width: 0;
    z-index: 2;
}

/*MOBILE-NAVIGATION*/

.mobile-navigation {
    width: 100%;
    z-index: 9999;
}

.nav-icon2 {
    cursor: pointer;
    height: 20px;
    position: absolute;
    right: 20px;
    top: 20px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    width: 30px;
    z-index: 99;
}

.nav-icon2 span {
    background: #323435;
    display: block;
    height: 3px;
    opacity: 1;
    position: absolute;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    width: 50%;
}

.nav-icon2.open span {
    background: #FFF;
}

.nav-icon2 span:nth-child(even) {
    left: 50%;
    border-radius: 0 9px 9px 0;
}

.nav-icon2 span:nth-child(odd) {
    left: 0px;
    border-radius: 9px 0 0 9px;
}

.nav-icon2 span:nth-child(1), .nav-icon2 span:nth-child(2) {
    top: 0px;
}

.nav-icon2 span:nth-child(3), .nav-icon2 span:nth-child(4) {
    top: 8px;
}

.nav-icon2 span:nth-child(5), .nav-icon2 span:nth-child(6) {
    top: 16px;
}

.nav-icon2.open span:nth-child(1), .nav-icon2.open span:nth-child(6) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.nav-icon2.open span:nth-child(2), .nav-icon2.open span:nth-child(5) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.nav-icon2.open span:nth-child(1) {
    left: 5px;
    top: 7px;
}

.nav-icon2.open span:nth-child(2) {
    left: calc(50% - 5px);
    top: 7px;
}

.nav-icon2.open span:nth-child(3) {
    left: -50%;
    opacity: 0;
}

.nav-icon2.open span:nth-child(4) {
    left: 100%;
    opacity: 0;
}

.nav-icon2.open span:nth-child(5) {
    left: 5px;
    top: 12px;
}

.nav-icon2.open span:nth-child(6) {
    left: calc(50% - 5px);
    top: 12px;
}

/* Overlay style */

.overlay {
    background: #1e232c;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 9;
}

.overlay nav {
    position: relative;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
}

.overlay ul {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: inline-block;
    height: 100%;
    position: relative;
}

.overlay ul li {
    display: block;
    padding: 15px 6px;
}

.overlay ul li a {
    color: #fff;
    display: inline-block;
    font-size: 25px;
    text-transform: uppercase;
    font-family: 'Stolzl Medium';
    position: relative;
}

.overflow-hidden {
    overflow: hidden;
}

/* Effects */

.overlay-hugeinc {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.2s, visibility 0s 0.2s;
    transition: opacity 0.2s, visibility 0s 0.2s;
}

.overlay-hugeinc.open {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
}

.nav-contacts {
    position: absolute;
    bottom: 20px;
    text-align: center;
    left: 0;
    right: 0;
    text-transform: uppercase;
}

.nav-contacts p {
    color: #FFFFFF;
    font-size: 15px;
}

.nav-contacts p span {
    color: #4f545e;
}

/*MOBILE-NAVIGATION*/

a.logo {
    text-align: left;
    display: block;
}

a.logo img {
    display: inline-block;
}

.top-right ul {
    text-align: right;
    padding: 6px 0px;
}

.top-right ul li {
    text-transform: uppercase;
    display: inline-block;
    font-family: "Stolzl Medium";
}

.top-right ul li span {
    color: #c8c8d7;
    padding: 0px 10px;
}

.top-right ul li a {
    color: #323435;
    display: inline-block;
    position: relative;
    padding-bottom: 7px;
}

.main-logo {
    display: inline-block;
    vertical-align: middle;
    margin-right: 20px;
}
.main-logo svg {
	width: 160px;
	height: 33px;
}
.main-logo path {
    fill: #323435;
}
/*SECTION-NAVIGATION*/

/*SHAPE-MASKS*/

.svg-shapes {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    animation: fadein 1s linear;
    -moz-animation: fadein 1s linear; /* Firefox */
    -webkit-animation: fadein 1s linear; /* Safari and Chrome */
    -o-animation: fadein 1s linear; /* Opera */
}

@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-moz-keyframes fadein { /* Firefox */
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.svg-shapes svg {
    position: absolute;
}

.scene{
    height:100%;
    overflow: hidden;
}

.svg-shapes .t2 {
    left: 5%;
    top: 16%;
}

.svg-shapes .t1 {
    right: 38%;
    top: 13%;
}

.svg-shapes .cr1 {
    right: 42%;
    bottom: 25%;

}

.svg-shapes .cr2 {
    left: 10%;
    bottom: 14%;
}

.svg-shapes .sq1 {
    right: 8%;
    top: 35%;
}

.svg-shapes .cross1 {
    right: 15%;
    bottom: 10%;
}

/*SHAPE-MASKS*/

/*BOX-ARROW*/

.box-arrow-link, .widow-killer, a.arrow-link {
    display: inline-block
}

a.arrow-link, a.arrow-link span, a.arrow-link span::before {
    transition: .45s cubic-bezier(.52, .01, .16, 1)
}

a.arrow-link {
    padding-right: 10px;
    position: relative;
    font-size: .9em
}

a.arrow-link span {
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top: -3px;
    width: 60px;
    height: 8px;
    overflow: hidden
}

.underline-link::after, a.arrow-link span::before {
    width: 100%;
    left: 0;
    content: ''
}

a.arrow-link span::before {
    position: absolute;
    top: 0;
    height: 100%;
    -webkit-transform: translateX(-50px);
    -moz-transform: translateX(-50px);
    -ms-transform: translateX(-50px);
    -o-transform: translateX(-50px);
    transform: translateX(-50px);
    background: url(../images/arrow.svg) center center/100% 100% no-repeat
}

a.arrow-link:hover {
    -webkit-transform: translateX(-25px);
    -moz-transform: translateX(-25px);
    -ms-transform: translateX(-25px);
    -o-transform: translateX(-25px);
    transform: translateX(-25px)
}

a.arrow-link:hover span {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}

a.arrow-link:hover span::before {
    -webkit-transform: translateX(-4px);
    -moz-transform: translateX(-4px);
    -ms-transform: translateX(-4px);
    -o-transform: translateX(-4px);
    transform: translateX(-4px)
}

.underline-link {
    position: relative
}

.underline-link::after {
    position: absolute;
    bottom: -5%;
    height: 2px;
    z-index: 0;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden
}

.underline-link span {
    z-index: 1;
    position: relative;
    -webkit-transition: .35s cubic-bezier(.7, .3, 0, 1);
    -moz-transition: .35s cubic-bezier(.7, .3, 0, 1);
    transition: .35s cubic-bezier(.7, .3, 0, 1)
}

.underline-link::before {
    background-color: #212121
}

.underline-link::after {
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: .45s cubic-bezier(.7, .3, 0, 1);
    -moz-transition: .45s cubic-bezier(.7, .3, 0, 1);
    transition: .45s cubic-bezier(.7, .3, 0, 1)
}

.underline-link:hover::after {
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1)
}

.arrow-head {
    width: 26px;
    height: 26px;
    overflow: hidden
}

.arrow-head span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: .45s cubic-bezier(.7, .3, 0, 1);
    -moz-transition: .45s cubic-bezier(.7, .3, 0, 1);
    transition: .45s cubic-bezier(.7, .3, 0, 1)
}

.arrow-head span::after, .arrow-head span::before {
    content: '';
    position: absolute;
    top: 50%
}

.arrow-head span::before {
    height: 3px;
    width: 90%;
    left: 0;
    margin-top: 0px;
    background-color: #FFF
}

.arrow-head span::after {
    right: 0;
    width: 9px;
    height: 9px;
    margin: -3px 0 0 -3px;
    background: url(../images/arrow-head-white.svg) center center/100% no-repeat
}

.arrow-head[data-color=black] span::before {
    background-color: #3c424e
}

.arrow-head[data-color=black] span::after {
    background: url(../images/arrow-head-black.svg) center center/100% no-repeat
}

.box-arrow-link {
    height: 42px;
    border: 2px solid #3c424e;
    background: -moz-linear-gradient(left, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5166f1', endColorstr='#000c0c0c', GradientType=1); /* IE6-9 */
    color: #FFF;
    text-transform: uppercase;
    font-family: 'Stolzl Medium';

    -webkit-transition: .52s cubic-bezier(.7, .3, 0, 1);
    -moz-transition: .52s cubic-bezier(.7, .3, 0, 1);
    transition: .52s cubic-bezier(.7, .3, 0, 1);
    -webkit-transform: translateX(-22px);
    -moz-transform: translateX(-22px);
    -ms-transform: translateX(-22px);
    -o-transform: translateX(-22px);
    transform: translateX(-22px)
}

a.box-arrow-link:focus, a.box-arrow-link:hover {
    color: #FFF;
}

.box-arrow-link .box-text {
    padding: 0 25px;
    line-height: 40px
}

.box-arrow-link:hover .box-text {
    color: #FFF;
}

.box-arrow-link .box-arrow-1, .box-arrow-link .box-arrow-2 {
    position: absolute;
    height: 43px;
    width: 50px;
    top: -2px;
    overflow: hidden
}

.box-arrow-link .box-arrow-1::before, .box-arrow-link .box-arrow-2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    height: 42px;
    border-top: 2px solid #3c424e;
    border-right: 2px solid #3c424e;
    border-bottom: 2px solid #3c424e;
    -webkit-transition: .55s cubic-bezier(.7, .3, 0, 1);
    -moz-transition: .55s cubic-bezier(.7, .3, 0, 1);
    transition: .55s cubic-bezier(.7, .3, 0, 1)
}

.box-arrow-link .box-arrow-1 .arrow-head, .box-arrow-link .box-arrow-2 .arrow-head {
    left: 50%;
    top: 50%;
    width: 22px;
    margin: -15px 0 0 -10px;
    position: absolute
}

.box-arrow-link .box-arrow-1 {
    right: 100%
}

.box-arrow-link .box-arrow-1::before {
    border-left: 2px solid #3c424e;
    transform-origin: 100% 0;
}

.box-arrow-link .box-arrow-2 {
    left: 100%
}

.box-arrow-link .box-arrow-2::before {
    margin-left: -3px;
    border-right: 2px solid #3c424e;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0
}

.box-arrow-link .box-arrow-1::before {
    -webkit-transform: translateX(105%);
    -moz-transform: translateX(105%);
    -ms-transform: translateX(105%);
    -o-transform: translateX(105%);
    transform: translateX(105%)
}

.box-arrow-link .box-arrow-1 .arrow-head span {
    -webkit-transform: translateX(-105%);
    -moz-transform: translateX(-105%);
    -ms-transform: translateX(-105%);
    -o-transform: translateX(-105%);
    transform: translateX(-105%)
}

.box-arrow-link:hover {
    -webkit-transform: translateX(25px);
    -moz-transform: translateX(25px);
    -ms-transform: translateX(25px);
    -o-transform: translateX(25px);
    transform: translateX(25px);
    -webkit-transition-delay: .15s;
    -moz-transition-delay: .15s;
    transition-delay: .15s
}

.box-arrow-link:hover .box-arrow-1::before {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition-delay: .22s;
    -moz-transition-delay: .22s;
    transition-delay: .22s
}

.box-arrow-link:hover .box-arrow-2::before {
    -webkit-transform: translateX(-105%);
    -moz-transform: translateX(-105%);
    -ms-transform: translateX(-105%);
    -o-transform: translateX(-105%);
    transform: translateX(-105%)
}

.box-arrow-link:hover .box-arrow-1 .arrow-head span {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition-delay: .22s;
    -moz-transition-delay: .22s;
    transition-delay: .22s
}

.box-arrow-link:hover .box-arrow-2 .arrow-head span {
    -webkit-transform: translateX(105%);
    -moz-transform: translateX(105%);
    -ms-transform: translateX(105%);
    -o-transform: translateX(105%);
    transform: translateX(105%);
    -webkit-transition-duration: .35s;
    -moz-transition-duration: .35s;
    transition-duration: .35s
}

.box-arrow-link.clicked:hover:not(.dark-box-arrow-link), .box-arrow-link.clicked:not(.dark-box-arrow-link) {
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: translateX(50px);
    -moz-transform: translateX(50px);
    -ms-transform: translateX(50px);
    -o-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0
}

.box-arrow-link.dark-box-arrow-link {
    border-color: #c8c8c8;
    color: #212121;
    margin-top: 32px;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}

.box-arrow-link.dark-box-arrow-link .box-arrow-1::before, .box-arrow-link.dark-box-arrow-link .box-arrow-2::before {
    border-top: 2px solid #c8c8c8;
    border-bottom: 2px solid #c8c8c8
}

.box-arrow-link.dark-box-arrow-link .box-arrow-1::before {
    border-left: 2px solid #c8c8c8;
    background-color: #c8c8c8
}

.box-arrow-link.dark-box-arrow-link .box-arrow-2::before {
    border-right: 2px solid #c8c8c8
}

.box-arrow-link.dark-box-arrow-link:hover {
    -webkit-transform: translateX(48px);
    -moz-transform: translateX(48px);
    -ms-transform: translateX(48px);
    -o-transform: translateX(48px);
    transform: translateX(48px)
}

/*BOX-ARROW*/

.hero-img {
    bottom: 0;
    display: table;
    height: 100%;
    position: absolute;
    transition: all 0.4s ease 0s;
    vertical-align: middle;
}

.txt-div {
    display: table-cell;
    vertical-align: middle;
}

.txt-div h1 {
    margin-bottom: 25px;
}

.txt-div h1 span {
	background:url(../images/line.png) no-repeat center bottom;
}

.txt-div p {
    font-family: 'Georgia';
    font-size: 18px;
    color: #323435;
    margin-bottom: 40px;
    font-style: italic;
}

.txt-div a.box-arrow-link {
    margin-left: 22px;
}

.mouse-icon {
    text-align: center;
}

.mouse-icon::after {
    background: #4d68f0 none repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 45px;
    position: absolute;
    width: 2px;
    left: 50%;
}

.mouse-icon svg {
    animation: scroll 1.5s ease-in-out infinite;
    -webkit-animation: scroll 1.5s ease-in-out infinite;
    position: absolute;
    bottom: 40px;
    margin-left: -7px;
    left: 50%;
}

@-webkit-keyframes scroll {

    0% {
        bottom: 50px;
    }
    50% {
        bottom: 60px;
    }
    100% {
        bottom: 50px;
    }
}

@keyframes scroll {
    0% {
        bottom: 50px;
    }
    50% {
        bottom: 60px;
    }
    100% {
        bottom: 50px;
    }
}

/*RECENT-WORK*/

.section-recent-work {
    background: #4d68f0 none repeat scroll 0 0;
    overflow: hidden;
    padding: 150px 0 90px;
    position: relative;
}

.section-recent-work .cross-2 {
    right: 25%;
    top: 10%;
}

.section-recent-work .triange-3 {
    left: 20%;
    top: 50%;
}

.web-work-parent {
    transition: all 0.5s ease-out 0s;
}

.work-placeholder {
    position: relative;
    display: inline-block;
    width: 100%;
}

.web-work-child {
    display: inline-block;
    position: relative;
    z-index: 9;
    height: 260px;
}

.web-work-child h6 {
    color: #fff;
    font-size: 13px;
    position: absolute;
    text-transform: uppercase;
    top: -25px;
    width: 75%;
}

.web-work-child h6 span {
    font-size: 75px;
    position: absolute;
    right: 0;
    top: -30px;
    z-index: -9;
}

.mac-img {
    margin-left: -102px;
    position: relative;
}

.mac-img img, .work-about-app img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);

    /*-webkit-filter: drop-shadow(5px 5px 5px #222);*/
    /*filter:         drop-shadow(5px 5px 5px #222);*/

    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.mac-img:hover img, .work-about-app:hover img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

/*.mac-img a, .work-about-app a {*/
    /*background: -moz-linear-gradient(left, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); !* FF3.6-15 *!*/
    /*background: -webkit-linear-gradient(left, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); !* Chrome10-25,Safari5.1-6 *!*/
    /*background: linear-gradient(to right, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); !* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ *!*/
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5166f1', endColorstr='#000c0c0c', GradientType=1); !* IE6-9 *!*/
    /*color: #fff;*/
    /*display: inline-block;*/
    /*font-size: 22px;*/
    /*height: 80px;*/
    /*left: 45%;*/
    /*line-height: 80px;*/
    /*margin: -30px 0 0 -10px;*/
    /*position: absolute;*/
    /*text-align: center;*/
    /*top: 30%;*/
    /*width: 80px;*/
    /*opacity: 0;*/
    /*z-index: 9;*/
    /*transform: translatex(-30px);*/
    /*-webkit-transform: translatex(-30px);*/


    /*transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;*/
    /*-moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;*/
    /*-webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;*/
/*}*/

/*.mac-img:hover a, .work-about-app:hover a {*/
    /*opacity: 1;*/
    /*transform: translatex(0px);*/
    /*-webkit-transform: translatex(0px);*/
    /*transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;*/
    /*-moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;*/
    /*-webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;*/
/*}*/

.mac-img a{
    display: block;
}

.mac-img a::before, .work-about-app a::before {
    background: -moz-linear-gradient(left, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(81, 102, 241, 1) 0%, rgba(168, 59, 255, 1) 100%, rgba(169, 59, 255, 0) 90%, rgba(12, 12, 12, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5166f1', endColorstr='#000c0c0c', GradientType=1); /* IE6-9 */
    color: rgb(255, 255, 255);
    content: "";
    display: inline-block;
    font-size: 22px;
    height: 80px;
    left: 40%;
    line-height: 80px;
    margin: -120px 0 0 -10px;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translateX(-30%);
    width: 80px;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.mac-img a::after, .work-about-app a::after {
    color: rgb(255, 255, 255);
    /*content: url("../images/arrow-3.svg");*/
		content: "";
		background:url(../images/arrow-3.svg) no-repeat center center;
		width:32px;
		height:32px;
		background-size:contain;
    font-size: 32px;
    left: 60%;
    margin-top: -105px;
    position: absolute;
    top: 50%;
    transform: translateX(-30%);
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.mac-img a:hover::before, .work-about-app a:hover::before{
    opacity: 1;
    visibility: visible;
    left: 50%;
    transition: all 0.3s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
		box-shadow: 0 0 30px rgba(0,0,0,0.5);
}

.mac-img a:hover::after, .work-about-app a:hover::after{
    opacity: 1;
    visibility: visible;
    left: 50%;
    transition: all 0.3s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.work-about-app a::before{
    left: 30%;
    margin-top: -90px;
}

.work-about-app a::after{
    left: 50%;
    margin-top: -75px;
}

.work-about-app a:hover::before{
    left: 40%;
}
.webkit .mac-img a::after{
    margin-top:-93px;
}
.webkit .work-about-app a::after{
    margin-top: -75px;
}

.work-about-app a:hover::after{
    left: 40%;
		margin-top:-65px;
}

.recent-work-box {
    left: 50%;
    position: absolute;
    text-align: center;
    transform: translateX(-50%);
}

.recent-work-link::before, .recent-work-link::after {
    background: #1e232c none repeat scroll 0 0;
    bottom: -70px;
    content: "";
    height: 130px;
    left: -5px;
    position: absolute;
    transform: rotate(45deg);
    width: 2px;
}

.recent-work-link::after {
    bottom: -80px;
    height: 20px;
    left: -70px;
}

.recent-work-link {
    color: #fff;
    display: inline-block;
    height: 350px;
    padding: 80px 70px;
    width: 350px;
    text-align: center;
    transition: all 0.5s ease-out 0s;
}

.on-scroll-div::before {
    background: rgb(30, 35, 44) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    transform: scaleY(0);
    transition: all 0.65s cubic-bezier(0.7, 0.3, 0, 1) 0s;
}

.on-scroll-addiv::before {
    transform: scaleY(1);
    transition: all 0.65s cubic-bezier(0.7, 0.3, 0, 1) 0s;
}

.on-scroll-div h1 {
    margin-bottom: 50px;
    transform: translateX(-30px);
    opacity: 0;
    ransition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.on-scroll-addiv h1 {
    transform: translateX(0px);
    opacity: 1;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.on-scroll-div .box-arrow-link {
    margin-right: -45px;
    opacity: 0;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.on-scroll-addiv .box-arrow-link {
    margin-right: 0px;
    opacity: 1;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.services-link-box {
    background: rgba(0, 0, 0, 0) url("../images/logo-shape-pricing.svg") no-repeat scroll center center;
    bottom: 110px;
    color: #fff;
    height: 200px;
    left: 70px;
    padding-top: 80px;
    position: absolute;
    text-align: center;
    width: 300px;
}

.services-link-box a {
    color: #fff;
    display: inline-block;
    line-height: 35px;
}

.services-link-box h5 {
    color: #FFF;
}

.services-link-box h6, .hero-services-txt h6, .hero-services-txt a {
    font-size: 13px;
    letter-spacing: 0.2px;
    text-transform: uppercase;
    position: relative;
    display: inline-block;
    padding-bottom: 5px;
    background: -moz-linear-gradient(left, #4d68f0 30%, #aa3bff 65%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #4d68f0 30%, #aa3bff 65%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #4d68f0 30%, #aa3bff 65%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.services-link-box h6:hover::after, .services-link-box h6:hover::before, .hero-services-txt a:hover::after, .hero-services-txt a:hover::before {
    left: 0;
    width: 100%;
}

.services-link-box h6::before, .hero-services-txt a::before {
    background-color: #A63BFE;
    transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;
    -moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;
    -webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.15s;
}

.services-link-box h6::after, .hero-services-txt a::after {
    background-color: #5165F1;
    transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;
    -moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;
    -webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;

}

.services-link-box h6::after, .services-link-box h6::before, .hero-services-txt a::after, .hero-services-txt a::before {
    bottom: -2px;
    content: "";
    height: 3px;
    left: auto;
    position: absolute;
    right: 0;
    width: 0;
    z-index: 2;
}

.work-about-app {
    float: right;
    position: relative;
    z-index: 9;
    transition: all 0.5s ease-out 0s;
}

.work-about-app h6 {
    color: #fff;
    line-height: 45px;
    position: absolute;
    right: 0;
    top: 35%;
    text-transform: uppercase;
    font-size: 13px;
}

.work-about-app h6 span {
    display: block;
    font-size: 75px;
    margin-left: -45px;
    position: relative;
    z-index: -9;
}

.work-about-app img {
    margin-right: 30px;
    margin-top: 20px;
}

/*CONTACTS-BTNS*/

.section-contacts {
    position: relative;
    width: 100%;
    display: inline-block;
    transition: all 0.5s ease-out 0s;
}

.btn-viewmore {
    background: #FFF;
    padding: 10%;
    width: 50%;
    text-align: center;
    float: left;
}

.section-contacts .cross-3 {
    top: 50%;
    position: absolute;
    left: 5%;
}

.section-contacts .triange-4 {
    position: absolute;
    top: 10%;
    right: 10%;
}

.btn-placeholder {
    display: table;
    vertical-align: middle;
}

.btn-txt {
    display: inline-block;
    transition: all 0.5s ease-out 0s;
}

.btn-txt a {
    background: #4d68f0; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #4d68f0 0%, #aa3bff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #4d68f0 0%, #aa3bff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #4d68f0 0%, #aa3bff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4d68f0', endColorstr='#aa3bff', GradientType=1); /* IE6-9 fallback on horizontal gradient */
    width: 315px;
    height: 315px;
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    vertical-align: middle;
    display: table-cell;
    position: relative;
    color: #1e232c;
    transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -webkit-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -moz-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -o-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -ms-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;

}

.btn-txt.square a:hover {
    border-radius:0 50% 0 50%;
    background: #4d68f0; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #aa3bff 0%, #4d68f0 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #aa3bff 0%, #4d68f0 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #aa3bff 0%, #4d68f0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aa3bff', endColorstr='#4d68f0', GradientType=1); /* IE6-9 fallback on horizontal gradient */

    transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -webkit-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -moz-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -o-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -ms-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;

}

.btn-txt.square a:after {
    content: "";
    background: #FFF;
    position: absolute;
    top: 14px;
    left: 14px;
    width: calc(100% - 28px);
    height: calc(100% - 28px);
    z-index: -1;
    transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -webkit-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -moz-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -o-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -ms-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;

}

.btn-txt.square a:hover:after {
    border-radius: 0 50% 0 50%;
}

.btn-txt h5 {
    margin-bottom: 5px;
}
.btn-txt h2 {
	font-size: 28px;
}

.btn-txt.circle a {
    border-radius: 50%;
    color: #FFF;
}

.btn-txt.circle a::after {
    border-radius: 50%;
    background: #1e232c;
}

.btn-txt.circle a:hover, .btn-txt.circle a:hover:after {
    border-radius:0 50% 0 50%;
}

.btn-contact-us {
    background: #1e232c none repeat scroll 0 0;
    float: right;
    padding: 10%;
    text-align: center;
    width: 50%;
}

/*TESTIMONIALS*/

.section-testimonials {
    padding: 150px 0 100px;
    position: relative;
}

.triange-5 {
    position: absolute;
    top: 40%;
    left: 5%;
}

.circle-4 {
    right: 10%;
    position: absolute;
}

.pricing-box {
    background: #fff none repeat scroll 0 0;
    bottom: 0;
    display: table;
    height: 495px;
    margin-right: 40px;
    padding: 40px;
    text-align: center;
    top: 0;
    vertical-align: middle;
}

.pricing-box-text {
    display: table-cell;
    vertical-align: middle;
}

.pricing-box-text h1 {
    margin-bottom: 35px;
}

.pricing-box-text h5 {
    line-height: 24px;
    margin-bottom: 35px;
}

ul.testimonials li {
    height: 280px;
}

ul.testimonials li .post-title-hdr h5 {
    color: #818997;
    margin-bottom: 25px;
}

ul.testimonials li .post-title-hdr h5 span {
    color: #4d68f0;
}

ul.testimonials li .post-title-hdr h6 {
    color: #323435;
    font-size: 13px;
    letter-spacing: 0.1px;
    margin-bottom: 25px;
    text-transform: uppercase;
}

ul.testimonials li p {
    color: #77808f;
    font-size: 13px;
    line-height: 22px;
}

/*TESTIMONIALS*/

/*FOOTER*/

.section-footer {
    background: #1e232c none repeat scroll 0 0;
    color: #77808f;
    padding: 40px;
    margin-top: -2px;
}

a.top-btn {
    display: inline-block;
    color: #FFF;
    margin-top: 5px;
}

a.top-btn svg {
    margin-bottom: 5px;
    margin-right: 5px;
    vertical-align: middle;
}

a.top-btn span {
    opacity: 0;
    margin-left: -5px;
    transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;
    -moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;
    -webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;
}

a.top-btn:hover span {
    opacity: 1;
    margin-left: 0px;
    transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;
    -moz-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;
    -webkit-transition: all 0.25s cubic-bezier(0.694, 0.048, 0.335, 1) 0.1s;
}

ul.footer-contacts {
    text-align: right;
    padding: 10px 0px;
		float:right;
}

ul.footer-contacts li {
    display: inline-block;
    margin-right: 50px;
		float:left;
}

ul.footer-contacts li img {
    margin-right: 5px;
		float:left;
		width:22px;
		height:18px;
}

ul.footer-contacts li:last-child {
    margin-right: 0px;
}

ul.footer-contacts li a {
    color: #77808f;
		float: left;
    margin-top: 2px;
}

/*FOOTER*/

/*SERVICES-PAGE*/

.services-hero {
     text-align: center;
     left: 50%;
     transform: translatex(-50%);
 }

.hero-services-txt {
    background: rgba(0, 0, 0, 0) url("../images/logo-shape-services.svg") no-repeat scroll center center;
    display: inline-block;
    padding: 100px 70px;
    position: relative;
}

.hero-services-txt h5 {
    margin-bottom: 18px;
}

.mouse-icon-dark::after {
    background: #1e232c none repeat scroll 0 0;
}

.section-services {
    background: #1e232c none repeat scroll 0 0;
    height: 160em;
    overflow: hidden;
    position: relative;
}

.section-services::after{
    background: #3a404a none repeat scroll 0 0;
    bottom: auto;
    content: "";
    height: 100px;
    left: 50%;
    position: absolute;
    width: 2px;
    bottom: 0px;
}

.services-parent::before {
    background: #3a404a none repeat scroll 0 0;
    bottom: auto;
    content: "";
    height: 400px;
    left: 50%;
    position: absolute;
    top: 0;
    width: 2px;
}

.services-parent {
    padding: 400px 0px 200px;
    position: relative;
    height:60em;
}

.services-parent:nth-child(2){
    padding-top: 700px;
}

.services-parent:nth-child(3){
    padding-top: 900px;
}

.services-child {
    color: rgb(255, 255, 255);
    margin: 50px 0;
    padding: 100px 0;
    position: relative;
    z-index: 9;
    transition: all 0.6s ease-out;
    -o-transition: all 0.6s ease-out;
    -moz-transition: all 0.6s ease-out;
    -webkit-transition: all 0.6s ease-out;
}

.service-name {
    margin-bottom: 80px;
}

.service-name h1 {
    position: relative;
    margin-bottom: 20px;
}

.service-name h1 span {
    color: #353c47;
    font-family: "Stolzl Bold";
    font-size: 85px;
    position: absolute;
    line-height: 60px;
    top: -80px;
}

.services-child{
    background: #1E232C;
}

.services-child ul.bullet-points {
    float: right;
    margin-right: 40px;
}

.services-child ul.bullet-points li {
    list-style: inside none lower-latin;
    font-size: 18px;
    padding: 10px 0px;
}

.services-child ul.bullet-points li p {
    color: #fff;
    display: inline-block;
    padding-left: 15px;
}

.design-services ul.bullet-points li {
    color: #4d68f0;
}

.service-desc {
    margin-left: 40px;
}

.service-desc p {
    color: #77808f;
    text-align: justify;
    line-height: 22px;
}

.marketing-services ul.bullet-points li {
    color: #ffd200;
}

.marketing-services .service-name {
    text-align: right;
}

.marketing-services .service-name h1 span {
    right: 0;
}

.marketing-services .service-desc {
    margin-left: 0;
    margin-right: 40px;
}

.marketing-services ul.bullet-points {
    float: left;
    margin-left: 40px;
    margin-right: 0;
}

.development-services ul.bullet-points li {
    color: #5cd2b5;
}

.section-completed-projects {
    padding: 8% 0 14%;
    text-align: center;
}

.section-completed-projects h5 {
    margin-bottom: 20px;
}

.prjct-counter {
    margin-bottom: 20px;
}

.prjct-counter h1 {
    color: #4d68f0;
    font-family: "Stolzl Medium";
    font-size: 185px;
    display: inline-block;
    vertical-align: top;
    line-height: 190px;
    width: 350px;
}

.prjct-counter span {
    font-size: 74px;
    position: absolute;
    margin-top: 10px;
    transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -webkit-transition: all 0.4s ease 0s;
}

.section-completed-projects h6 {
    text-transform: uppercase;
    margin-bottom: 50px;
}

.services-child ul.svg-graphics {
    position: relative;
}

.services-child ul.svg-graphics li {
    position: absolute;
}

.design-services ul.svg-graphics li:nth-child(1) {
    top: -155px;
    left: 100px;
}

.design-services ul.svg-graphics li:nth-child(2) {
    left: 60px;
    top: -130px;
}

.design-services ul.svg-graphics li:nth-child(3) {
    left: 120px;
    top: -70px;
}

.design-services ul.svg-graphics li:nth-child(4) {
    left: -70px;
    bottom: -10px;
}

.marketing-services ul.svg-graphics li:nth-child(1) {
    right: 110px;
    top: -150px;
}

.marketing-services ul.svg-graphics li:nth-child(2) {
    right: 20px;
    top: -150px;
}

.marketing-services ul.svg-graphics li:nth-child(3) {
    right: -40px;
    top: 0;
}

.marketing-services ul.svg-graphics li:nth-child(4) {
    right: 200px;
    top: -50px;
}

.development-services ul.svg-graphics li:nth-child(1) {
    left: -70px;
    top: -155px;
}

.development-services ul.svg-graphics li:nth-child(2) {
    left: 80px;
    top: -130px;
}

.development-services ul.svg-graphics li:nth-child(3) {
    left: 150px;
    top: -50px;
}

.development-services ul.svg-graphics li:nth-child(4) {
    bottom: -10px;
    left: -70px;
}

/*SERVICES==PAGE*/

/*PRICING==PAGE*/

.pricing-hero-banner {
    background: #4d68f0;
}

.section-top-pricing .main-nav .navbar-default ul > li > a::before {
    background-color: #ce92fc;
}

.section-top-pricing .main-nav .navbar-default ul > li > a::after {
    background-color: #FFF;
}

.pricing-hero-banner .hero-services-txt::before, .pricing-hero-banner .hero-services-txt::after {
    background: #1e232c none repeat scroll 0 0;
    bottom: -10px;
    content: "";
    height: 50px;
    left: 119px;
    position: absolute;
    transform: rotate(43deg);
    -webkit-transform: rotate(43deg);
    -moz-transform: rotate(43deg);
    width: 2px;
}

.pricing-hero-banner .hero-services-txt::after {
    bottom: -38px;
    height: 25px;
    left: 80px;
}

.chrome .pricing-hero-banner .hero-services-txt::before {
    left: 122px;
}

.chrome .pricing-hero-banner .hero-services-txt::after {
    left: 83px;
}

.safari .pricing-hero-banner .hero-services-txt::before {
    left: 116px;
}

.safari .pricing-hero-banner .hero-services-txt::after {
    left: 76px;
}

.pricing-hero-banner .hero-services-txt {
    background: rgba(0, 0, 0, 0) url("../images/logo-shape-pricing.svg") no-repeat scroll center center;
}

.pricing-hero-banner .hero-services-txt h5 {
    color: #FFF;
}

.pricing-hero-banner .nav-icon2 span {
    background: #F3F3F8;
}

.section-pricing {
    background: rgb(77, 104, 240) none repeat scroll 0 0;
    height: 140em;
}

.section-pricing::after{
    display: none;
}

.section-pricing .services-parent{
    height: auto;
}

.section-pricing .services-child{
     background: #4D68F0;
 }

.section-pricing .services-parent::before, .section-pricing .services-parent::after {
    background: #1e232c;
}

ul.price-tabs {
    margin-bottom: 180px;
}

ul.price-tabs li {
    display: table;
    padding-left: 40px;
    padding-right: 40px;
    text-align: center;
    vertical-align: middle;
}

ul.price-tabs li a {
    background: #1e232c none repeat scroll 0 0;
    color: #fff;
    display: table-cell;
    padding: 100px 30px 75px;
    transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -webkit-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -moz-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    vertical-align: middle;
    height: 300px;
}

.safari ul.price-tabs li a {
    padding-top: 0;
    padding-bottom: 0;
}

ul.price-tabs li a h1 {
    font-size: 25px;
    line-height: 28px;
    margin-bottom: 30px;
    height: 60px;
    transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}

ul.price-tabs li a h5 {
    margin-bottom: 30px;
    font-size: 16px;
}

ul.price-tabs li a h6 {
    color: #4f5560;
    font-size: 13px;
    text-transform: uppercase;
}

ul.price-tabs li.active a {
    transform: scale(1.15);
    -webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -webkit-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -moz-transition: all 0.35s cubic-bezier(0.65, 0, 0.35, 1) 0s;
}

ul.price-tabs li a svg {
    margin-left: -35px;
    position: absolute;
    top: 40px;
    transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -webkit-transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -moz-transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    width: 60px;
}

ul.price-tabs li.active a svg {
    visibility: hidden;
    opacity: 0;
    transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -webkit-transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1) 0s;
    -moz-transition: all 0.2s cubic-bezier(0.65, 0, 0.35, 1) 0s;
}

ul.price-tabs li.active a h1 {
    transform: scale(1.3);
}

.select-multiple-txt {
    position: relative;
    text-align: center;
    margin-bottom: 120px;
}

.select-multiple-txt::after {
    background: #1e232c none repeat scroll 0 0;
    content: "";
    height: 50px;
    position: absolute;
    width: 2px;
    margin-top: 10px;
    left: 50%;
}

.select-multiple-txt h5 {
    color: #1e232c;
}

ul.price-list {
    margin: auto;
}

ul.price-list li {
    /*padding: 15px 25px;*/
    position: relative;
}

ul.price-list li h3 {
    display: inline-block;
    text-transform: capitalize;
    font-family: 'Stolzl';
    font-size: 25px;
}

ul.price-list li .price {
    float: right;
    color: #7e93f9;
}

ul.price-list li .price span {
    color: #fff;
    font-size: 25px;
    vertical-align: middle;
    margin-left: 20px;
}

/*ul.price-list li:hover, ul.price-list li.active {*/
/*background: #1e232c;*/
/*}*/

/*ul.price-list li:hover .price {*/
/*color: #4f5560;*/
/*}*/

.get-quote {
    text-align: center;
    padding-bottom: 0px;
    position: relative;
}

.get-quote .recent-work-link::before, .get-quote .recent-work-link::after {
    display: none;
}

.section-pricing .get-quote:after {
    background: none;
}

.get-quote .recent-work-link {
    background: #FFF;
    padding: 50px;
    color: #1e232c;
}

.get-quote .recent-work-link h1 {
    margin-bottom: 35px;
}

.get-quote .recent-work-link h5 {
    margin-bottom: 35px;
    line-height: 25px;
}

/*PRICING==PAGE*/

/*PORTFOLIO-PAGE*/

.section-top-work .main-logo svg path, .section-top-pricing .main-logo svg path, .section-top-work .main-logo svg rect, .section-top-pricing .main-logo svg rect {
    fill: #f3f3f8;
}
.nav-bg-color.section-top-work .main-logo svg rect {
	fill:#323435;
}
#footerLogo_Icon path {
	fill: #4d68f0;
}

.section-top-work .main-nav .navbar-default ul > li > a, .section-top-work .top-right ul li, .section-top-work .top-right ul li a, .section-top-pricing .main-nav .navbar-default ul > li > a, .section-top-pricing .top-right ul li, .section-top-pricing .top-right ul li a {
    color: #f3f3f8;
}

/*.section-top-work .top-right ul li span {
    color: #49505c;
}*/

.nav-bg-color .main-nav .navbar-default ul > li > a, .nav-bg-color .top-right ul li, .nav-bg-color .top-right ul li a {
    color: #323435;
}

.nav-bg-color .main-logo svg path {
    fill: #323435;
}

.section-top-work .nav-icon2 span{
    background: #F3F3F8;
}

.section-top-work.nav-bg-color .nav-icon2 span{
    background:#323435;
}
.section-top-work.nav-bg-color .nav-icon2.open span{
    background:#F3F3F8;
}

.section-projects {
    margin-bottom: -4px;
}

.portfolio-hero-banner .svg-shapes {
    height: 322px;
}

.portfolio-hero-banner {
    background: #1e232c;
}

.portfolio-hero-banner .svg-shapes .square-4 {
    right: 28%;
    top: 50%;
}

.portfolio-hero-banner .svg-shapes .cr1{
    right: 22%;
    top: 35%;
}

.portfolio-hero-banner .svg-shapes .cross1{
    bottom: 45%;
    left: 10%;
}

.page-tittle {
    color: #f3f3f8;
    padding: 170px 0 90px;
}

.page-tittle h1, .page-tittle h5{
    position: relative;
}

ul.main-projects {
    width: 100%;
    display: inline-block;
		float:left;
}

/* clearfix */
.grid:after {
    content: '';
    display: block;
    clear: both;
}

.grid-sizer, .grid-item {
    width: 25%;
    overflow: hidden;
}

.grid-item--width2 {
    width: 50%;
}

ul.main-projects li.grid-item img {
    width: 100%;
    transition: all 0.5s ease-in-out 0.1s;
}

ul.main-projects li a{
    display: block;
}
ul.main-projects li:hover img {
    transform: scale(1.1) rotate(2deg);
    transition: all 0.5s ease-in-out 0.1s;
}

ul.main-projects li .project-caption-parent::before {
    content: '';
    background: rgba(0, 0, 0, 0.9) none repeat scroll 0 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    transform: scaleY(0);
    transition: all 0.5s cubic-bezier(0.7, 0.3, 0, 1) 0s
}

ul.main-projects li .project-caption-child {
    left: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
}

ul.main-projects li .project-caption-child h3 {
    color: #fff;
    font-size: 18px;
    text-transform: uppercase;
    margin: 20px 0px 10px;
    opacity: 0;
    visibility: hidden;
    transform:translateX(-100px) ;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

ul.main-projects li .project-caption-child h5 {
    color: #49505c;
    opacity: 0;
    visibility: hidden;
    transform:translateX(-100px) ;
    transition: all 0.6s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

ul.main-projects li .project-caption-child span {
    background: #4878f0;
    background: -moz-linear-gradient(left, #4878f0 0%, #8561d7 50%, #9f35ea 100%);
    background: -webkit-linear-gradient(left, #4878f0 0%, #8561d7 50%, #9f35ea 100%);
    background: linear-gradient(to right, #4878f0 0%, #8561d7 50%, #9f35ea 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4878f0', endColorstr='#9f35ea', GradientType=1);
    color: #fff;
    display: inline-block;
    width: 80px;
    height: 80px;
    padding: 20px 0px 0px 0px;
    float: none;
    position: relative;
    box-shadow: 4.5px 7.794px 62px 0px rgb(0, 0, 0);
    opacity: 0;
    visibility: hidden;
    transform:translateX(-100px);
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

ul.main-projects li .project-caption-child span::after {
    /*content: url("../images/arrow-3.svg");*/
		content:"";
		background:url(../images/arrow-3.svg) no-repeat center center;
		background-size:contain;
    left:25px;
    /*margin-left: -10px;*/
    position: absolute;
    top:25px;
    /*transform: translateY(-50%);*/
		width: 32px;
    height: 32px;
		transform:translateX(100px);
		opacity:0;
}

ul.main-projects li:hover .project-caption-parent::before {
    opacity: 1;
    visibility: visible;
    transform: scaleY(1);
    transition: all 0.5s cubic-bezier(0.7, 0.3, 0, 1) 0s;
}

ul.main-projects li:hover .project-caption-child h3{
    opacity: 1;
    visibility: visible;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
    transform:translateX(0px) ;
}

ul.main-projects li:hover .project-caption-child h5{
    opacity: 1;
    visibility: visible;
    transition: all 0.6s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
    transform:translateX(0px);
}

ul.main-projects li:hover .project-caption-child span{
    opacity: 1;
    visibility: visible;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
    transform:translateX(0px) ;
}
ul.main-projects li:hover .project-caption-child span::after {
	opacity:1;
	transition: all 0.6s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
  transform:translateX(0px);
}

.tiles {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.tile {
    position: relative;
    float: left;
    width: 100%;
    height: 550px;
    overflow: hidden;
}

.photo {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: transform .5s ease-out;
}

/*CONTACT-POPUP*/

.contact-us-modal {
    max-width: 1170px;
    position: relative;
    width: 100%;
}

.modal-dialog {
    margin-top: 0;
    top: 50%;
    transform: translateY(-50%) !important;
}

.map-wrapper {
    padding: 0;
}

.map-adrs {
    /*background: #232831 none repeat scroll 0 0;*/
    position: relative;
    height: 660px;
}

#map {
    width: 100%;
    height: 660px;
    position: absolute;
		background:url(../images/map.jpg) no-repeat center bottom;
		background-size: cover;
		cursor:pointer;
    /*opacity: 0.25;*/
}

#map .gmnoprint, #map .gm-style-cc, #map .gm-style-cc, #map > div > .gm-style > div:nth-child(2) {
	display:none !important;
}
/*#map > div > .gm-style > div > div:nth-child(1){
	transform: matrix(1, 0, 0, 1, 0, 570) !important;	
}*/
#map .test {
	transform: matrix(1, 0, 0, 1, 0, 570) !important;	
}
.map-adrs ul {
    display: inline-block;
    margin: 60px;
    position: relative;
    z-index: 9;
}

.map-adrs ul li {
    margin-bottom: 55px;
}

.map-adrs ul li:last-child {
    margin-bottom: 0px;
}

.map-adrs ul li h5 {
    color: #616977;
    margin-bottom: 10px;
}

.map-adrs ul li h6 {
    text-transform: uppercase;
    color: #FFF;
    font-size: 13px;
    line-height: 18px;
}

.cntct-form {
    background: #4d68f0;
    padding: 60px;
    height: 660px;
}

.cntct-form h1 {
    color: #fff;
    font-size: 32px;
    line-height: 35px;
}

.the-form {
    margin-top: 60px;
}

.the-form, .the-form .input {
    position: relative;
    width: 100%;
}

.the-form .input {
    margin-bottom: 75px;
}

.the-form .input::after, .the-form .input::before {
    content: " ";
    display: table;
}

.the-form .input::after {
    clear: both;
}

.the-form .input input {
    border: none;
    border-bottom: 2px solid #3c424e;
    display: block;
    font-size: 18px;
    font-family: 'Georgia';
    color: #FFF;
    font-style: italic;
    background: none;
    padding: 8px 5px;
    transition: border-color 0.25s ease 0s;
    width: 100%;
}

.the-form .input input:focus {
    border-color: #fff;
    outline: medium none;
}

.the-form .input textarea {
    background: none;
    border: none;
    border-bottom: 2px solid #3c424e;
    padding: 8px 5px;
    transition: border-color 0.25s ease 0s;
    width: 100%;
    resize: none;
    font-family: 'Georgia';
    font-style: italic;
    color: #FFF;
    font-size: 18px;
}

.the-form .input textarea:focus {
    border-color: #FFF;
    outline: medium none;
}

.the-form .input .label {
    font-family: 'Stolzl Medium';
    font-size: 13px;
    text-transform: uppercase;
    left: 0;
    position: absolute;
    top: -13px;
    font-weight: normal;
    padding: 0;
}

.the-form .input::after, .the-form .input::before {
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    transition: width 0.4s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;
    width: 0;
}

.the-form .input::before {
    background: #FFF none repeat scroll 0 0;
    transition-delay: 0.1s;
    z-index: 10;
}

.webkit .the-form ul li:nth-child(4) .input::after, .webkit .the-form ul li:nth-child(4) .input::before{
    bottom: 3px;
}

/*.the-form .input::after {*/
/*background: #a93bff none repeat scroll 0 0;*/
/*z-index: 9;*/
/*}*/

.the-form .input:hover::after, .the-form .input:hover::before {
    width: 101%;
}

.the-form ul li:last-child {
    text-align: right;
}

.the-form ul li:last-child .box-arrow-link {
    margin-right: 22px;
}

.close-contact {
    color: #fff;
    cursor: pointer;
    display: block;
    height: 25px;
    padding: 12px;
    position: absolute;
    right: 45px;
    top: 55px;
    transition: all 0.3s ease 0s;
    width: 25px;
    z-index: 10;
}

.close-contact span {
    background-color: #fff;
    height: 3px;
    position: absolute;
    top: 18px;
    transition: all 0.4s cubic-bezier(0.694, 0.048, 0.335, 1) 0s;
    width: 100%;
}

.close-contact span::before {
    background-color: #A53CFE;
    transition: all 0.3s ease 0s;
}

.close-contact span::after, .close-contact span::before {
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 0;
}

.close-contact span::after {
    background-color: #f3f3f3;
    transition: all 0.3s ease 0.3s;
}

.close-contact span:first-child {
    left: 0;
    transform: rotate(45deg);
}

.close-contact span:last-child {
    right: 0;
    transform: rotate(-45deg);
}

.close-contact:hover {
    transform: scale(1.1);
}

.close-contact:hover span::after, .close-contact:hover span::before {
    width: 100%;
}

.close-contact:hover span:first-child {
    transform: rotate(-45deg);
}

.close-contact:hover span:last-child {
    transform: rotate(45deg);
}

/*CONTACT-POPUP*/

/*GET-QUOTE-POPUP*/
.items-total {
    background: #1e232c;
    position: relative;
    height: 660px;
    padding: 60px 50px 30px 60px;
}

.items-total h1 {
    font-size: 32px;
    color: #FFF;
    line-height: 35px;
    margin-bottom: 40px;
}

.items-total ul.price-list {
    width: 100%;
    margin-top: 20px;
}

.items-total ul.price-list li h3 {
    color: #fff;
    font-size: 20px;
}

.items-total ul.price-list li {
    padding: 20px 0px;
}

.total-price {
    background: #252a34 none repeat scroll 0 0;
    bottom: 0;
    left: 0;
    padding: 30px 20px;
    position: absolute;
    right: 0;
    text-align: center;
}

.total-price h6 {
    color: #4f5560;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-family: 'Stolzl Medium';
}

.total-price h1 {
    font-size: 39px;
}

.total-price input[type="text"] {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    color: rgb(255, 255, 255);
    font-size: 40px;
    text-align: center;
    width: 100%;
}

/*GET-QUOTE-POPUP*/

/*PROJECTS-DETAILS*/

.project-banner {
    text-align: center;
}

.project-banner img {
    display: inline-block;
    width: 100%;
}

.project-detail-txt {
    text-align: center;
    padding: 80px 0px;
}

.project-detail-txt h3 {
    margin-bottom: 20px;
}

.project-detail-txt p {
    font-family: 'Stolzl Book';
    font-size: 16px;
    letter-spacing: 0.2px;
    line-height: 24px;
    padding: 0 100px;
}

.project-inner-page, .project-img-2 {
    text-align: center;
}

.project-inner-page {
    margin-bottom: 100px;
}

.project-inner-page img, .project-img-2 img {
    display: inline-block;
}

.project-inner-page h1 {
    transition: none;
    margin-bottom: 50px;
}

.project-img-2 {
    padding: 80px 0px;
}

.project-inner-page ul li {
    margin-bottom: 50px;
}

.project-inner-page ul li:last-child {
    margin-bottom: 0px;
}

.projects-arrows{
    overflow: hidden;
}

.projects-arrows a {
    display: inline-block;
    position: fixed;
    top: 50%;
    z-index: 9;
    margin-top: -40px;
}

.projects-arrows a span.prev-arrow, .projects-arrows a span.next-arrow{
    border: 2px solid rgb(50, 52, 53);
    color: rgb(50, 52, 53);
    display: inline-block;
    font-size: 24px;
    height: 80px;
    padding-top: 10px;
    text-align: center;
    transform: rotate(45deg);
    width: 80px;
    z-index: 9;
    margin-left: -40px;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.projects-arrows a span.next-arrow{
    margin-right: -40px;
    margin-left: 0px;
}

.projects-arrows .next-project{
    right: 0;
}

.projects-arrows a span.prev-arrow::before {
    content: "\f177";
    font-family: FontAwesome;
    margin-left: 5px;
    margin-top: -4px;
    position: absolute;
    transform: rotate(-45deg);
}

.projects-arrows a span.next-arrow::before {
    content: "\f178";
    font-family: FontAwesome;
    left: 8px;
    margin-top: 30px;
    position: absolute;
    transform: rotate(-45deg);
}

.projects-arrows a span.prev-arrow:hover, .projects-arrows a span.next-arrow:hover {
    background: #4F66F0;
    color: #FFF;
    border-color: #4F66F0;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

span.project-title {
    background: #555555;
    border-radius: 2px;
    color: rgb(255, 255, 255);
    font-size: 12px;
    left: 90px;
    margin-top: -23px;
    padding: 15px 10px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 50%;
    width: 140px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.next-project span.project-title{
    left: auto !important;
    right: 90px;
}

.projects-arrows a:hover span.project-title{
    left: 70px;
    opacity: 1;
    visibility: visible;
    transition: all 0.45s cubic-bezier(0.62, 0.02, 0.34, 1) 0s;
}

.projects-arrows a.next-project:hover span.project-title{
    right: 70px;
}

/*PROJECTS-DETAILS*/

#logos {
    position: absolute;
    top: 0px;
    left: 150px;
    -webkit-perspective: 800px;
    perspective: 800px;
}

#cube {
    display: block;
    position: relative;
    margin: 30px auto;
    height: 200px;
    width: 200px;
    -webkit-transform-style: preserve-3d;
    -webkit-transform: rotateX(0) rotateY(0) rotateZ(0);
    transform-style: preserve-3d;
    transform: rotateX(0) rotateY(0) rotateZ(0);
}

#front {
    position: absolute;
    height: 200px;
    width: 200px;
    -webkit-backface-visibility: visible;
    -webkit-transform: translateZ(100px);
    backface-visibility: visible;
    transform: translateZ(100px);
}

#back {
    position: absolute;
    height: 200px;
    width: 200px;
    -webkit-backface-visibility: visible;
    -webkit-transform: rotateY(180deg) translateZ(100px);
    backface-visibility: visible;
    transform: rotateY(180deg) translateZ(100px);
}

#cube {
    -webkit-animation: upyourscache1481887168207 5s infinite linear;
    animation: upyourscache1481887168207 5s infinite linear;
}

@-webkit-keyframes upyourscache1481887168207 {
    0% {
        -webkit-transform: rotateY(0);
    }
    100% {
        -webkit-transform: rotateY(360deg);
    }
}

@keyframes upyourscache1481887168207 {
    0% {
        transform: rotateY(0);
    }
    100% {
        transform: rotateY(360deg);
    }
}

/*.nav-tabs-dropdown {*/
/*display: none;*/
/*border-bottom-left-radius: 0;*/
/*border-bottom-right-radius: 0;*/
/*}*/

/*.nav-tabs-dropdown:before {*/
/*content: "\e114";*/
/*font-family: 'Glyphicons Halflings';*/
/*position: absolute;*/
/*right: 30px;*/
/*}*/

/*@media screen and (min-width: 991px) {*/
/*#nav-tabs-wrapper {*/
/*display: block !important;*/
/*}*/

/*ul.price-tabs li a h2{*/
/*display: none;*/
/*}*/
/*}*/

/*@media screen and (max-width: 991px) {*/

/*.nav-tabs-dropdown {*/
/*display: block;*/
/*}*/

/*#nav-tabs-wrapper {*/
/*display: none;*/
/*border-top-left-radius: 0;*/
/*border-top-right-radius: 0;*/
/*text-align: center;*/
/*}*/

/*ul.price-tabs li a svg, ul.price-tabs li a h5, ul.price-tabs li a h1{*/
/*display: none;*/
/*}*/

/*ul.price-tabs li a {*/
/*padding: 20px;*/
/*text-align: left;*/
/*width: 100%;*/
/*}*/

/*ul.price-tabs li.active a, ul.price-tabs li.active a h1 {*/
/*transform: scale(1);*/
/*-webkit-transform: scale(1);*/
/*-moz-transform: scale(1);*/
/*}*/

/*ul.price-tabs li a h2{*/
/*font-size: 26px;*/
/*margin-bottom:5px;*/
/*}*/

/*.nav-tabs-dropdown{*/
/*color: #FFF;*/
/*}*/

/*}*/

/* Base for label styling */

[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
}

[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
    cursor: pointer;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
}

[type="checkbox"]:not(:checked) + label:after {
    opacity: 0;
    transform: scale(0);
}

[type="checkbox"]:checked + label:after {
    opacity: 1;
    transform: scale(1);
}

[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
    box-shadow: none;
    border-color: #bbb;
    background-color: #ddd;
}

[type="checkbox"]:disabled:checked + label:after {
    color: #999;
}

[type="checkbox"]:disabled + label {
    color: #aaa;
}

[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
    border: 1px dotted blue;
}

ul.price-list li label {
    display: inline-block;
    font-family: "Stolzl";
    font-size: 25px;
    font-weight: normal;
    padding: 15px 25px;
    text-transform: capitalize;
    width: 95%;
    transition: all .2s;
    margin-bottom: 2px;
}

.mac ul.price-list li label {
    font-family:'Stolzl Light';
}

ul.price-list li label .price {
    float: right;
    transition: all .2s;
}

ul.price-list li label .price > span {
    color: #fff;
    font-size: 25px;
    vertical-align: middle;
    margin-left: 15px;
    transition: all .2s;
}

ul.price-list li label .price span.starting-from {
    color: #7e93f9;
    font-size: 13px;
}

ul.price-list li input:checked + label, ul.price-list li input:hover + label {
    background: #1E232C;
    width: 100%;
    padding-left: 70px;
    transition: all .2s;
}

[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
    content: url("../images/tick-mark.svg");
    left: 25px;
    margin-top: -18px;
    position: absolute;
    top: 50%;
    transition: all .2s;
}

ul.price-list li input:checked + label .price span.starting-from {
    color: #4f5560;
}

#interacthings {
    position: absolute;
    top: 50%;
    right: 0;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    height: 60px;
    width: 52px;
}

.price-custom-scroll {
    height: 300px;
}

.price-list-popup label {
    border-bottom: 2px solid rgba(255, 255, 255, 0.05);
    color: rgb(255, 255, 255);
    display: block;
    font-size: 20px;
    padding: 18px 0px;
    width: 100%;
    font-weight: normal;
    margin-bottom:0px;
}

.price-list-popup label:last-child {
    border-bottom: none;
}

.price-list-popup label span.starting-from {
    display: none;
}

.price-list-popup label .price {
    float: right;
}

.price-list-popup label span {
    font-size: 24px;
}
.contact-us-modal > .modal-content > .row {
	margin:0;
}