.v-middle {
	position:absolute;
	width:100%;
	top:75%;
	left:0;
	-webkit-transform:translate(0, -50%);
	-moz-transform:translate(0, -50%);
	-ms-transform:translate(0, -50%);
	-o-transform:translate(0, -50%);
	transform:translate(0, -50%)
}
.valign {
	display:flex;
	box-align:center;
	align-items:center
}
.demo-1 {
	background:url(../img/header.jpg);
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-color:rgba(0, 0, 0, .2);
	background-blend-mode:overlay;
	max-width:100%;
	-webkit-clip-path:none;
	clip-path:none
}
.demo-1 #particles-js {
	width:100%;
	height:100%;
	background-size:cover;
	background-position:100%;
	background-repeat:no-repeat
}

.card-title {
    margin-bottom: .5rem;
    font-size: 15px;
    font-weight: 600 !important;
}

.title {
    display: block!important;
    margin: auto;
    margin-bottom: 50px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}
.title h3 {
    font-family: Philosopher,sans-serif;
    font-weight: 700;
    text-shadow: 2px 4px 3px rgb(0 0 0 / 20%);
    display: inline-block;
    position: relative;
}

.title h3:before {
    position: absolute;
    content: "";
    top: 50%;
    left: -60px;
    width: 50px;
    height: 2px;
    background: #03a9f4;
}


.title h3:after {
    position: absolute;
    content: "";
    top: 50%;
    right: -60px;
    width: 50px;
    height: 2px;
    background: #03a9f4;
}

@media all and (max-width:768px) {

.btn-bg-md:hover {
	background:0 0!important
}
.button-scroll {
	position:absolute;
	bottom:10%;
	left:calc(50% - 13px);
	width:26px;
	height:50px;
	border-radius:15px;
	border:2px solid #888;
	cursor:pointer;
	z-index:9;
	transition:all 1s
}
.button-scroll:hover {
	border:2px solid #fff
}
.button-scroll span {
	height:10px;
	width:2px;
	position:absolute;
	left:calc(50% - 1px);
	background:#888;
	-webkit-animation:finger 1.5s infinite alternate;
	-webkit-animation:finger 1.5s infinite;
	animation:finger 1.5s infinite
}
@-webkit-keyframes finger {
10% {
opacity:1
}
100% {
opacity:0;
-webkit-transform:translateY(20px);
transform:translateY(20px)
}
}
@keyframes finger {
10% {
opacity:1
}
100% {
opacity:0;
-webkit-transform:translateY(20px);
transform:translateY(20px)
}
}
@keyframes hvr-ripple-out {
100% {
top:-12px;
right:-12px;
bottom:-12px;
left:-12px;
opacity:0
}
}
@-webkit-keyframes hvr-ripple-out {
100% {
top:-12px;
right:-12px;
bottom:-12px;
left:-12px;
opacity:0
}
}
.section-padding {
	padding:80px 0
}
.mbl-0 {
	margin-left:0!important;
	padding-left:0!important
}
.mbr-0 {
	margin-right:0!important;
	padding-right:0!important
}
.mt-0 {
	margin-top:0!important
}
.mt-5 {
	margin-top:5px!important
}
.mt-10 {
	margin-top:10px!important
}
.mt-15 {
	margin-top:15px!important
}
.mt-20 {
	margin-top:20px!important
}
.mt-25 {
	margin-top:25px!important
}
.mt-30 {
	margin-top:30px!important
}
.mt-35 {
	margin-top:35px!important
}
.mt-40 {
	margin-top:40px!important
}
.mt-45 {
	margin-top:45px!important
}
.mt-50 {
	margin-top:50px!important
}
.mt-55 {
	margin-top:55px!important
}
.mt-60 {
	margin-top:60px!important
}
.mt-62 {
	margin-top:62px!important
}
.mt-65 {
	margin-top:65px!important
}
.mt-70 {
	margin-top:70px!important
}
.mt-75 {
	margin-top:75px!important
}
.mt-80 {
	margin-top:80px!important
}
.mt-85 {
	margin-top:85px!important
}
.mt-90 {
	margin-top:90px!important
}
.mt-95 {
	margin-top:95px!important
}
.mt-100 {
	margin-top:100px!important
}
.mb-0 {
	margin-bottom:0!important
}
.mb-5 {
	margin-bottom:5px!important
}
.mb-10 {
	margin-bottom:10px!important
}
.mb-15 {
	margin-bottom:15px!important
}
.mb-20 {
	margin-bottom:20px!important
}
.mb-25 {
	margin-bottom:25px!important
}
.mb-30 {
	margin-bottom:30px!important
}
.mb-35 {
	margin-bottom:35px!important
}
.mb-40 {
	margin-bottom:40px!important
}
.mb-45 {
	margin-bottom:45px!important
}
.mb-50 {
	margin-bottom:50px!important
}
.mb-55 {
	margin-bottom:55px!important
}
.mb-60 {
	margin-bottom:60px!important
}
.mb-62 {
	margin-bottom:62px!important
}
.mb-65 {
	margin-bottom:65px!important
}
.mb-70 {
	margin-bottom:70px!important
}
.mb-75 {
	margin-bottom:75px!important
}
.mb-80 {
	margin-bottom:80px!important
}
.mb-85 {
	margin-bottom:85px!important
}
.mb-90 {
	margin-bottom:90px!important
}
.mb-95 {
	margin-bottom:95px!important
}
.mb-100 {
	margin-bottom:100px!important
}
.pt-0 {
	padding-top:0!important
}
.pt-5 {
	padding-top:5px!important
}
.pt-10 {
	padding-top:10px!important
}
.pt-15 {
	padding-top:15px!important
}
.pt-20 {
	padding-top:20px!important
}
.pt-25 {
	padding-top:25px!important
}
.pt-30 {
	padding-top:30px!important
}
.pt-35 {
	padding-top:35px!important
}
.pt-40 {
	padding-top:40px!important
}
.pt-45 {
	padding-top:45px!important
}
.pt-50 {
	padding-top:50px!important
}
.pt-55 {
	padding-top:55px!important
}
.pt-60 {
	padding-top:60px!important
}
.pt-65 {
	padding-top:65px!important
}
.pt-70 {
	padding-top:70px!important
}
.pt-75 {
	padding-top:75px!important
}
.pt-80 {
	padding-top:80px!important
}
.pt-85 {
	padding-top:85px!important
}
.pt-90 {
	padding-top:90px!important
}
.pt-95 {
	padding-top:95px!important
}
.pt-100 {
	padding-top:100px!important
}
.pb-0 {
	padding-bottom:0!important
}
.pb-5 {
	padding-bottom:5px!important
}
.pb-10 {
	padding-bottom:10px!important
}
.pb-15 {
	padding-bottom:15px!important
}
.pb-20 {
	padding-bottom:20px!important
}
.pb-25 {
	padding-bottom:25px!important
}
.pb-30 {
	padding-bottom:30px!important
}
.pb-35 {
	padding-bottom:35px!important
}
.pb-40 {
	padding-bottom:40px!important
}
.pb-45 {
	padding-bottom:45px!important
}
.pb-50 {
	padding-bottom:50px!important
}
.pb-55 {
	padding-bottom:55px!important
}
.pb-60 {
	padding-bottom:60px!important
}
.pb-65 {
	padding-bottom:65px!important
}
.pb-70 {
	padding-bottom:70px!important
}
.pb-75 {
	padding-bottom:75px!important
}
.pb-80 {
	padding-bottom:80px!important
}
.pb-85 {
	padding-bottom:85px!important
}
.pb-90 {
	padding-bottom:90px!important
}
.pb-95 {
	padding-bottom:95px!important
}
.pb-100 {
	padding-bottom:100px!important
}
.no-padding {
	padding:0!important
}
.loading {
	position:fixed;
	top:0;
	left:0;
	height:100%;
	width:100%;
	background-color:#000;
	z-index:9999999999999
}
.spinner {
	margin:50vh auto;
	width:50px;
	height:40px;
	text-align:center;
	font-size:10px
}
.spinner>div {
	background-color:#fff;
	height:100%;
	width:4px;
	display:inline-block;
	-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;
	animation:sk-stretchdelay 1.2s infinite ease-in-out
}
.spinner .rect2 {
	-webkit-animation-delay:-1.1s;
	animation-delay:-1.1s
}
.spinner .rect3 {
	-webkit-animation-delay:-1s;
	animation-delay:-1s
}
.spinner .rect4 {
-webkit-animation-delay:-.9s;
animation-delay:-.9s
}
.spinner .rect5 {
-webkit-animation-delay:-.8s;
animation-delay:-.8s
}
@-webkit-keyframes sk-stretchdelay {
0%, 100%, 40% {
-webkit-transform:scaleY(.4)
}
20% {
-webkit-transform:scaleY(1)
}
}
@keyframes sk-stretchdelay {
0%, 100%, 40% {
transform:scaleY(.4);
-webkit-transform:scaleY(.4)
}
20% {
transform:scaleY(1);
-webkit-transform:scaleY(1)
}
}
body {
	font-family:'Source Sans Pro', sans-serif;
	font-weight:400;
	overflow-x:hidden!important
}
* {
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
	text-decoration:none!important;
	list-style:none!important;
	outline:0!important;
	font-family:'Open Sans', sans-serif
}
.title {
	display:block!important;
	margin:auto;
	margin-bottom:50px;
	text-align:center;
	text-transform:uppercase;
	width:100%
}
.title h3 {
	font-family:Philosopher, sans-serif;
	font-weight:700;
	text-shadow:2px 4px 3px rgba(0, 0, 0, .2);
	display:inline-block;
	position:relative
}
.title h3:before {
	position:absolute;
	content:"";
	top:50%;
	left:-60px;
	width:50px;
	height:2px;
	background:#03a9f4
}
.title h3:after {
	position:absolute;
	content:"";
	top:50%;
	right:-60px;
	width:50px;
	height:2px;
	background:#03a9f4
}
.active-1 {
	color:#03a9f4!important;
	position:relative
}
.active-1::before {
content:"";
position:absolute;
top:15%;
width:50%;
height:1px;
background:#fafafa;
-webkit-animation-duration:1.5s;
animation-duration:1.5s;
-webkit-animation-name:move-porder;
animation-name:move-porder;
-webkit-animation-iteration-count:infinite;
animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
animation-direction:alternate;
-webkit-transition:all .8s;
transition:all .8s
}
.active-1::after {
content:"";
position:absolute;
right:-50%;
bottom:15%;
width:50%;
height:1px;
background:#fafafa;
-webkit-animation-duration:1.5s;
animation-duration:1.5s;
-webkit-animation-name:move-porder-1;
animation-name:move-porder-1;
-webkit-animation-iteration-count:infinite;
animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
animation-direction:alternate;
-webkit-transition:all .8s;
transition:all .8s
}
@-webkit-keyframes move-porder {
from {
left:-50%
}
to {
	left:50%
}
}
@keyframes move-porder {
from {
left:-50%
}
to {
	left:50%
}
}
@-webkit-keyframes move-porder-1 {
from {
right:-50%
}
to {
	right:50%
}
}
@keyframes move-porder-1 {
from {
right:-50%
}
to {
	right:50%
}
}
@media (max-width:991px) {
.active-1::before {
display:none
}
.active-1::after {
display:none
}
}
.navbar.scrolling-navbar {
	overflow:hidden!important
}
.header {
	position:relative;
	max-width:100%;
	height:100vh;
	background:url(../img/header.jpg) no-repeat;
	background-size:cover;
	background-attachment:fixed;
	background-color:rgba(0, 0, 0, .8);
	background-blend-mode:overlay
}
.header .caption {
	margin:auto
}
.header .caption h2 {
	font-family:Courier, sans-serif;
	font-weight:700;
	text-shadow:2px 4px 3px rgba(0, 0, 0, .5);
	font-size:5em;
	color:#FFFFFF;
	margin-bottom:15px;
}
.header .caption h4 {
	font-weight:500;
	text-shadow:2px 4px 3px rgba(0, 0, 0, .5);
	font-size:1.8em;
	color:#e2e2e2
}
.about {
	position:relative
}
.about::before {
content:"";
position:absolute;
width:100%;
height:70%;
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#f7f7f7));
background:linear-gradient(#fff 0, #f7f7f7 100%);
-webkit-transform-origin:top right;
transform-origin:top right;
-webkit-transform:skewY(4deg);
transform:skewY(4deg);
opacity:.7;
z-index:-1
}
.about .part-photo {
	position:relative
}
.about .part-photo::after {
content:"";
position:absolute;
top:15px;
left:15px;
right:15px;
bottom:15px;
border:5px solid rgba(255, 255, 255, .2)
}
.about .info p {
	padding-bottom:20px;
	border-bottom:1px solid #e2e2e2
}
.about .info h4 {
	font-weight:700
}
.about .info h5 {
	font-weight:600
}
.about .info h6 {
	font-weight:700;
	margin-bottom:20px
}
.about .info h6 span {
	font-weight:400;
	padding-left:10px
}
.skills {
	background:#f7f7f7
}
.skills .skills-prog {
	display:block;
	width:100%
}
.skills .skills-prog h6 {
	font-weight:700;
	margin:15px 0
}
.skills .barfiller {
	width:100%;
	height:22px;
	border-radius:55px;
	position:relative;
	margin-bottom:40px
}
.skills .barfiller .fill {
	display:block;
	position:relative;
	width:0;
	height:100%;
	border-radius:55px
}
.skills .barfiller .tip {
	background:#fff;
	border-radius:50%;
	margin-top:-4px;
	padding:2px 4px;
	font-size:12px;
	font-weight:700;
	left:5px;
	position:absolute;
	z-index:2
}
.services {
	position:relative;
	background:url(../img/services.jpg) no-repeat;
	background-size:cover;
	background-attachment:fixed;
	background-color:rgba(0, 0, 0, .4);
	background-blend-mode:overlay
}
.services .servies-item {
	position:relative;
	padding:15px
}
.services .servies-item::before {
position:absolute;
content:"";
height:20px;
width:20px;
border:0 solid #03a9f4;
-webkit-transition:all .3s ease-in-out;
transition:all .3s ease-in-out;
top:0;
left:0;
border-top-width:1px;
border-left-width:1px
}
.services .servies-item::after {
position:absolute;
content:"";
height:20px;
width:20px;
border:0 solid #03a9f4;
-webkit-transition:all .3s ease-in-out;
transition:all .3s ease-in-out;
top:0;
right:0;
border-top-width:1px;
border-right-width:1px
}
.services .servies-item:hover i {
	-webkit-animation-name:hvr-ripple-out;
	animation-name:hvr-ripple-out;
	-webkit-animation-duration:1.5s;
	animation-duration:1.5s
}
.services .servies-item .bb::before {
position:absolute;
content:"";
height:20px;
width:20px;
border:0 solid #03a9f4;
-webkit-transition:all .3s ease-in-out;
transition:all .3s ease-in-out;
bottom:0;
left:0;
border-bottom-width:1px;
border-left-width:1px
}
.services .servies-item .bb::after {
position:absolute;
content:"";
height:20px;
width:20px;
border:0 solid #03a9f4;
-webkit-transition:all .3s ease-in-out;
transition:all .3s ease-in-out;
bottom:0;
right:0;
border-bottom-width:1px;
border-right-width:1px
}
.services .servies-item i {
	margin-top:30px;
	font-size:3rem;
	color:#FFFFFF;
}
.services .servies-item h4 {
	text-transform:uppercase;
	margin:20px 0;
	color:#e2e2e2
}
.services .servies-item p {
	color:#bfbfbf;
	margin-bottom:30px
}
@media (max-width:771px) {
.servies-item {
margin-top:20px
}
}
.portfolio .filtering {
	margin:auto
}
.portfolio .filtering .active-1 {
	color:#03a9f4!important;
	position:relative;
	overflow:hidden!important
}
.portfolio .filtering .active-1::before {
content:"";
position:absolute;
top:15%;
width:50%;
height:1px;
background:#999;
-webkit-animation-duration:1.5s;
animation-duration:1.5s;
-webkit-animation-name:move-porder;
animation-name:move-porder;
-webkit-animation-iteration-count:infinite;
animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
animation-direction:alternate;
-webkit-transition:all .8s;
transition:all .8s;
overflow:hidden!important
}
.portfolio .filtering .active-1::after {
content:"";
position:absolute;
right:-50%;
bottom:15%;
width:50%;
height:1px;
background:#999;
-webkit-animation-duration:1.5s;
animation-duration:1.5s;
-webkit-animation-name:move-porder-1;
animation-name:move-porder-1;
-webkit-animation-iteration-count:infinite;
animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
animation-direction:alternate;
-webkit-transition:all .8s;
transition:all .8s
}
.portfolio .filtering span {
	position:relative;
	margin:0 10px;
	padding:10px 3px;
	font-size:16px;
	color:#777;
	cursor:pointer;
	overflow:hidden!important
}
.portfolio .gallery {
	margin:0;
	padding:0
}
.portfolio .gallery .item-img {
	margin:0;
	padding:0
}
.portfolio .gallery .item-img .item-img-sn {
	position:relative;
	overflow:hidden
}
.portfolio .gallery .item-img .item-img-sn img {
	width:100%;
	-webkit-transition:all 1s;
	transition:all 1s
}
.portfolio .gallery .item-img .item-img-sn h4 {
	width:100%;
	position:absolute;
	top:20%;
	left:-20%;
	text-align:center;
	font-size:16px;
	color:#999;
-webkit-transition:all .5s;
transition:all .5s;
	-webkit-transform:perspective(500px) rotateX(90deg);
	transform:perspective(500px) rotateX(90deg);
	z-index:3
}
.portfolio .gallery .item-img .item-img-sn .icon {
	position:absolute;
	-webkit-transition:all 1s;
	transition:all 1s;
	left:50%;
	bottom:0;
	text-align:center;
	z-index:-1
}
.portfolio .gallery .item-img .item-img-sn .icon a {
	display:inline-block;
	font-size:22px
}
.portfolio .gallery .item-img .item-img-sn:before {
	content:"";
	position:absolute;
	top:-100%;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, .8);
	-webkit-transform:skewX();
	transform:skewX();
-webkit-transition:all .8s;
transition:all .8s;
	z-index:1
}
.portfolio .gallery .item-img .item-img-sn:hover:before {
	top:0
}
.portfolio .gallery .item-img .item-img-sn:hover img {
	-webkit-filter:grayscale(50%);
	filter:grayscale(50%);
	-webkit-transform:scale(1.1);
	transform:scale(1.1)
}
.portfolio .gallery .item-img .item-img-sn:hover h4 {
	left:0;
	-webkit-transform:perspective(500px) rotateX(0);
	transform:perspective(500px) rotateX(0)
}
.portfolio .gallery .item-img .item-img-sn:hover .icon {
	display:block;
	bottom:50%;
	z-index:2
}
@media (max-width:660px) {
.portfolio .filtering span {
padding:6px 10px
}
.portfolio .filtering .active {
border-radius:10px
}
}
.client {
	position:relative;
	background:url(../img/services.jpg) no-repeat;
	background-size:cover;
	background-attachment:fixed;
	background-color:rgba(0, 0, 0, .8);
	background-blend-mode:overlay
}
.client .title h3 {
	color:#f7f7f7
}
.client span {
	color:#03a9f4;
	font-weight:700;
	font-size:2.5rem;
	margin-bottom:2rem
}
.client .client-item {
	padding-bottom:1rem
}
.client .client-item p {
	color:#d2d2d2;
	margin-bottom:1rem
}
.client .client-item h6 {
	color:#03a9f4;
padding-bottom:.5rem
}
.client .client-item h5 {
	color:#ccc
}
.client .owl-theme .owl-nav.disabled+.owl-dots {
	bottom:60px
}
.client .owl-theme .owl-nav.disabled+.owl-dots span {
	height:12px;
	width:4px;
	border-radius:none
}
.client .owl-theme .owl-nav.disabled+.owl-dots .active span {
	height:16px;
	background:#03a9f4
}
.blog h4 {
	font-size:1.2em;
	font-weight:600!important
}
.blog .data {
	margin:10px 0;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	color:#444
}
.blog .data span {
	padding:10px 15px 10px 0
}
.blog img {
	width:100%
}
.blog a {
	color:#03a9f4
}
.contact {
	background:#f7f7f7
}
.contact .contact-item {
	position:relative;
	padding-left:45px;
	margin:30px 0
}
.contact .contact-item .c-icon {
	position:absolute;
	left:0;
	top:0;
	display:inline-block;
	background:#03a9f4;
	width:30px;
	height:30px;
	text-align:center;
	line-height:30px;
	border-radius:3px;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg)
}
.contact .contact-item .c-icon i {
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
	color:#fff
}
.contact .contact-item .c-text {
	display:inline-block!important
}
.contact .contact-item .c-text h5 {
	color:#777;
	font-size:12px;
	text-transform:uppercase;
	padding-bottom:5px
}
.contact form .btn {
	width:50%
}

.blog h4 {
    font-size: 1.2em;
    font-weight: 600!important;
}


footer {
/*	background:#1c2331!important;*/
	padding:50px 0
}
footer .cop {
	text-align:center
}
footer .cop h2 {
	color:#797979;
	padding:10px 0
}
footer .cop .icon {
	display:inline-block;
	margin:20px 10px;
	cursor:pointer
}
footer .cop .icon .c-icon {
	display:inline-block;
	background:#1d1d1d;
	width:30px;
	height:30px;
	text-align:center;
	line-height:30px;
	border-radius:3px;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg)
}
footer .cop .icon .c-icon i {
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
	color:#fff
}
footer .cop span {
	display:block;
	color:#d2d2d2
}
.page-footer {
	margin-top:0!important;
	padding-top:40px;
	background-color:#4285f4;
	color:#fff
}
.demo-1 {
	background:url(../img/header.jpg);
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-color:rgba(0, 0, 0, .2);
	background-blend-mode:overlay;
	max-width:100%;
	-webkit-clip-path:none;
	clip-path:none;
	height: 100vh;
}
.demo-1 #particles-js {
	width:100%;
	height:100%;
	background-size:cover;
	background-position:100%;
	background-repeat:no-repeat
}
