body{
	 font-family: 'Open Sans', sans-serif;
}

a{
	-webkit-transition: all .5s ease 0s;
    -moz-transition: all .5s ease 0s;
    -o-transition: all .5s ease 0s;
    transition: all .5s ease 0s;
}

a,a:focus,a:hover{text-decoration:none !important;}

#header-area{
	position: relative;
	padding:120px 0px;
	background:url(../images/bg.jpg) no-repeat center center;
	background-size:cover;
	position:relative;
}
#header-area:before{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	content:"";
	background:rgba(255,255,255,.88);
}


.header-title h1 {
    color: #474747;
    font-size: 120px;
    line-height: 120px;
    text-transform: uppercase;
    font-weight: 700;
    padding: 0px;
}
.header-title h2{
	font-size:36px;
	font-weight:700;
	color:#000;
	letter-spacing:10px;
	margin-top:27px;
	
}
.header-title h1 strong{
	-webkit-text-fill-color: transparent;
  -ms-text-fill-color: transparent;
  background-attachment: scroll, scroll;
  -ms-background-clip: text;
  -webkit-background-clip: text;
  background-clip: text;
  background-color: rgba(0, 0, 0, 0);
  background-image: -webkit-linear-gradient(transparent, transparent), url("../images/text-effect.jpg");
  background-image: -ms-linear-gradient(transparent, transparent), url("../images/text-effect.jpg");
  background-image: linear-gradient(transparent, transparent), url("../images/text-effect.jpg");
  background-origin: padding-box, padding-box;
  background-position: center center;
  background-repeat: repeat, repeat;
  background-size: cover;
  color: #cf1b45;
  position: relative;
  transition: all 300ms linear 0s;
  font-weight:700;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     .header-title h1 strong{
	  background-image: none;
	  background-image: none;
	  background-image: none;
	}
}


#demo-area{
	padding:50px 0px 19px 0px;
}

.demo{
	position:relative;
	margin-top:50px;
	border:1px solid #ddd;
}

.demo img{
	margin-left:auto;
	margin-right:auto;
}

.demo-button li a {
	background: #000 none repeat scroll 0 0;
	border-radius: 5px;
	color: #fff;
	display: inline-block;
	font-size: 18px;
	min-height: 60px;
	min-width: 200px;
	padding-top: 17px;
	text-align: center;
	text-transform: uppercase;
	-webkit-transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition:all .3s ease 0s;
	font-weight:700;
}
.demo-button {
    margin: 93px 0px 38px 0px;
    padding: 0;
    list-style-type: none;
}
.demo-button li {
    display:inline-block;
	margin:0px 10px;
}

.demo-button li a:hover{
	background:#ff5722;
}
.demo h3 {
	margin:0;
	text-align:center;
	padding:21px 0;
	background:#fafafa;
	color:#000;
	-webkit-transition: .4s;
	-ms-transition: .4s;
	-moz-transition: .4s;
	-o-transition: .4s;
	transition: .4s;
	text-transform:uppercase;
	font-weight:700;
	position:absolute;
	bottom:0;
	width:100%;
	font-size:14px;
}
.demo h3  i{ 
	padding:0 8px;
	color:#999999;
	-webkit-transition: .4s;
	-ms-transition: .4s;
	-moz-transition: .4s;
	-o-transition: .4s;
	transition: .4s;
}
.demo a:hover h3{
	color:#fff;
	background:#ff5722;
}
.demo a:hover h3 i{
	color:#fff;
	transform:rotateY(180deg);
}
.demo h3 a {
	color:#000;
	font-size:14px;
	line-height:27px;
}
.demo img{
	width:100%;
}

#footer-area{
	padding:6px 0px;
	background:#494949;
	margin-top:80px;
}

.footer-text {
	padding: 15px;
    margin: 0px;
    font-size: 12px;
    line-height: 18px;
    color: #ababab;
}

.footer-text a{
	color: #ffffff;
}
.footer-text.text-right a{
	color: #ababab;
}
.footer-text a:hover{
	color: #ffffff;
}

/* Responsive CSS */

@media only screen and ( min-width:2000px ) {

	#header-area{
		padding:340px 0px;

	}

}
@media only screen and ( max-width:1280px ) {
	#header-area{
		padding:140px 0px;

	}
	.header-title h1{
		font-size:70px;
		line-height:80px;
	}
	

}
@media only screen and ( max-width:768px ) {

	#header-area{
		padding:58px 0px;

	}
	.header-title h1{
		font-size:50px;
		line-height:55px;
	}
	.header-title h2 {
	  font-size: 24px;
	  margin-top: 17px;
	}
	.demo-button {
	  margin: 43px 0 38px;
	}
	.demo-button li a {
	  font-size: 14px;
	  font-weight: 400;
	  min-height: 45px;
	  min-width: 150px;
	  padding-top:13px;
	}
	

}

@media only screen and (max-width:480px) {

	.header-title h1 {
  
		font-size:30px;
		line-height:30px;
	}
	.header-title h2 {
	  font-size: 24px;
	  letter-spacing:3px;
	}
	.header-title a {
    font-size: 16px;
	}

	#demo-area{
		padding:45px 0px;
	}
	#demo-area .col-xs-6{
		width:100%;
	}

	.demo-button li {
    display: inline-block;
    margin-top: 14px;
    width: 100%;
    margin: 8px 0px;
	}
	.demo-button li a{
		max-width:100%;
	}
	.demo-button {
	margin: 40px 0px 0px 0px;
	padding: 0;
	list-style-type: none;
	}
	.footer-text p {
    color: #fff;
    font-size: 13px;
    line-height: 18px;
    margin: 0;
    padding: 6px;
}
	#footer-area .col-xs-6{
		width:100%;
		text-align:center;
	}
	.footer-text{
		text-align:center;
	}


}

@media only screen and ( max-width:320px ) {

}

/*  preloader   */
#loading {
  background-color: #00a94f;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 1;
  margin-top: 0px;
  top: 0px;
}
#loading #loading-center {
  width: 100%;
  height: 100%;
  position: relative;
}
#loading #loading-center-absolute {
  position: absolute;
  left: 50%;
  top: 50%;
  height: 150px;
  width: 150px;
  margin-top: -75px;
  margin-left: -75px;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
#loading .object {
  width: 20px;
  height: 20px;
  background-color: #FFF;
  position: absolute;
  left: 65px;
  top: 65px;
  border-radius: 500px;
}
#loading .object:nth-child(2n+0) {
  margin-right: 0px;
}
#loading #object_one {
  -webkit-animation: object_one 2s infinite;
  animation: object_one 2s infinite;
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
#loading #object_two {
  -webkit-animation: object_two 2s infinite;
  animation: object_two 2s infinite;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
#loading #object_three {
  -webkit-animation: object_three 2s infinite;
  animation: object_three 2s infinite;
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
#loading #object_four {
  -webkit-animation: object_four 2s infinite;
  animation: object_four 2s infinite;
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
#loading #object_five {
  -webkit-animation: object_five 2s infinite;
  animation: object_five 2s infinite;
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}
#loading #object_six {
  -webkit-animation: object_six 2s infinite;
  animation: object_six 2s infinite;
  -webkit-animation-delay: 0.7s;
  animation-delay: 0.7s;
}
#loading #object_seven {
  -webkit-animation: object_seven 2s infinite;
  animation: object_seven 2s infinite;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}
#loading #object_eight {
  -webkit-animation: object_eight 2s infinite;
  animation: object_eight 2s infinite;
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}
@-webkit-keyframes object_one {
  50% {
    -webkit-transform: translate(-65px, -65px);
  }
}
@keyframes object_one {
  50% {
    transform: translate(-65px, -65px);
    -webkit-transform: translate(-65px, -65px);
  }
}
@-webkit-keyframes object_two {
  50% {
    -webkit-transform: translate(0, -65px);
  }
}
@keyframes object_two {
  50% {
    transform: translate(0, -65px);
    -webkit-transform: translate(0, -65px);
  }
}
@-webkit-keyframes object_three {
  50% {
    -webkit-transform: translate(65px, -65px);
  }
}
@keyframes object_three {
  50% {
    transform: translate(65px, -65px);
    -webkit-transform: translate(65px, -65px);
  }
}
@-webkit-keyframes object_four {
  50% {
    -webkit-transform: translate(65px, 0);
  }
}
@keyframes object_four {
  50% {
    transform: translate(65px, 0);
    -webkit-transform: translate(65px, 0);
  }
}
@-webkit-keyframes object_five {
  50% {
    -webkit-transform: translate(65px, 65px);
  }
}
@keyframes object_five {
  50% {
    transform: translate(65px, 65px);
    -webkit-transform: translate(65px, 65px);
  }
}
@-webkit-keyframes object_six {
  50% {
    -webkit-transform: translate(0, 65px);
  }
}
@keyframes object_six {
  50% {
    transform: translate(0, 65px);
    -webkit-transform: translate(0, 65px);
  }
}
@-webkit-keyframes object_seven {
  50% {
    -webkit-transform: translate(-65px, 65px);
  }
}
@keyframes object_seven {
  50% {
    transform: translate(-65px, 65px);
    -webkit-transform: translate(-65px, 65px);
  }
}
@-webkit-keyframes object_eight {
  50% {
    -webkit-transform: translate(-65px, 0);
  }
}
@keyframes object_eight {
  50% {
    transform: translate(-65px, 0);
    -webkit-transform: translate(-65px, 0);
  }
}