/*---------------------------------------------------------------

  Project Name: Agency - Responsive Onepage HTML Template
  File Name: style.css
  Author: Sharjeel Anjum
  Author URI: https://themeforest.net/user/ecreativesol
  Version: 1.0.0

------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700|Ubuntu:400,500,700');


body {
    background: #eee;
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 400;
    overflow-x: hidden;
}


/*---------------------------------------
   Typorgraphy              
-----------------------------------------*/

h1,h2,h3,h4,h5,h6 {
  font-family: 'Ubuntu', sans-serif;
}

h1,h2,h4 {
  font-weight: 500;
}

h1 {
  font-size: 60px;
  letter-spacing: -1px;
}

h2 {
  color: #272727;
  font-size: 36px;
  line-height: 52px;
  margin: 0px;
}

h3 {
  font-size: 16px;
  line-height: 32px;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin:5px 0 30px 0;
}

h4 {
  color: #454545;
  font-size: 18px;
  line-height: 26px;
}

h5 {
  letter-spacing: 0.5px;
}

p {
    color: #555;
    font-size: 16px;
    font-weight: 300;
    line-height: 25px;
    letter-spacing: 0.2px;
}

img{max-width:100%;}


/*---------------------------------------
   Buttons               
-----------------------------------------*/

.btn-success:focus {
  background-color: #000;
  color: #ffffff;
}

.section-btn {
  background: #fff;
  border: 3px solid #fff;
  border-radius: 0;
  color: #000;
  font-size: 18px;
  font-weight: 700;
  padding: 12px 30px;
  margin-top: 22px;
  text-transform: uppercase;
}

.section-btn:focus,
.section-btn:hover {
  background: #fff;
  border-color: #fff;
  color: #333;
}



/*---------------------------------------
   General               
-----------------------------------------*/

html{
  -webkit-font-smoothing: antialiased;
}

a{transition:ease-in-out 0.3s; -webkit-transition:ease-in-out 0.3s; -moz-transition:ease-in-out 0.3s; -ms-transition:ease-in-out 0.3s;  color: #ff2828; text-decoration: none !important;}

a:hover, a:active, a:focus {
  color: #ff2828;
  outline: none;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*:before,
*:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.parallax-section {
  background-attachment: fixed !important;
  background-size: cover !important;
}

.section-title {
  margin: 0;
  padding-bottom:50px; text-align:center;
}
.section-title p{max-width:800px; margin:auto;}


.parallax-section{
  padding-top: 60px;
  position: relative;
}

#counter,
#service,
#contact,
#address {
  text-align: center;
}

.demoimage{margin-bottom:10px; box-shadow:0 0 15px rgba(0,0,0,0.1); padding:10px; -webkit-transition: all 0.5s;
    transition: all 0.5s; background:#fff;}
.demoimage img {
	display:block;
}

.demoimage:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}



/*---------------------------------------
    Home section              
-----------------------------------------*/

#home {
    background: url('../images/home-bg.jpg') 50% 0 repeat-y fixed;
    background-size: cover;
    background-position: center center;
    display: -webkit-box;
    display: -webkit-flex;
     display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
     align-items: center;
     color: #ffffff;
    position: relative;
    text-align: center;
	padding:50px 0;
}

#home .overlay {
  background: rgba(0,0,0,0.3);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#home img{position:relative; z-index:10;}

.slide-text h1{margin-top:0; font-size:48px;}
.slide-text h3{font-size:30px; margin:40px 0 0 0;}



