/*** ======= // TABLE OF CONTENT // ============================
01- Google Fonts
02- Plugin Stylesheets Import
03- General Styling
04- Cross Browser Compatibility


===================================================== ***/

/*===== Google Fonts =====*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i);
@import url(https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i);


/*===== General Styling =====*/
html, 
body{overflow-x:hidden;}
body {
  float: left;
  font-family: open sans;
  letter-spacing: -.2px;
  margin: 0;
  position: relative;
  width: 100%;
}
h1,h2,h3,h4,h5,h6{
  font-family: poppins;
  color: #2e2e2d;
  letter-spacing: -.5px;
  font-weight: 700;
}
p{
  font-family: open sans;
  color: #3c3c3c;
  line-height: 28px;
  font-size: 16px;
  letter-spacing: 0;
}
ul li,
ol li{
  font-family:open sans;
  color:#444;
  font-size:13px;
  line-height:20px;
}
a{color: inherit;}
a:hover,
a:focus{
  text-decoration:none;
  outline:none;
}
input,
textarea,
select,
button {border: 0;}
button,
input[type="submit"],
.fileContainer,
input[type="file"] {cursor: pointer;}
input:focus,
textarea:focus,
select:focus,
button:focus,
a:focus,
.form-wrp fieldset p a:focus,
.page-link:focus {
  border-color: transparent;
  outline: none;
  -webkit-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}
textarea {resize: none;}
main {
  float: left;
  position: relative;
  width: 100%;
}
body.boxed {text-align: center;}
body.boxed main {
  float: none;
  display: inline-block;
  text-align: left;
  width: 1720px;
}
section{
  float:left;
  position:relative;
  width:100%;
}
.spacing {
  float: left;
  padding: 110px 0;
  position: relative;
  width: 100%;
}
.remove-gap,
.spacing.remove-gap {padding-top: 0;}
.remove-bottom,
.spacing.remove-bottom {padding-bottom: 0;}
.no-spacing,
.spacing.no-spacing {padding: 0;}
.container {
  padding: 0;
  max-width:1170px;
}
.remove-ext,
.remove-ext2,
.remove-ext3,
.remove-ext4,
.remove-ext5,
.remove-ext6,
.remove-ext7,
.remove-ext8,
.remove-ext9,
.remove-ext10,
.remove-ext11,
.remove-ext12,
.remove-ext13,
.remove-ext14,
.remove-ext15 {
  float: left;
  margin-bottom: -20px;
  width: 100%;
}
.remove-ext2 {margin-bottom: -25px;}
.remove-ext3 {margin-bottom: -30px;}
.remove-ext4 {margin-bottom: -35px;}
.remove-ext5 {margin-bottom: -40px;}
.remove-ext6 {margin-bottom: -45px;}
.remove-ext7 {margin-bottom: -50px;}
.remove-ext8 {margin-bottom: -55px;}
.remove-ext9 {margin-bottom: -60px;}
.remove-ext10 {margin-bottom: -65px;}
.remove-ext11 {margin-bottom: -70px;}
.remove-ext12 {margin-bottom: -75px;}
.remove-ext13 {margin-bottom: -80px;}
.remove-ext14 {margin-bottom: -85px;}
.remove-ext15 {margin-bottom: -90px;}
.fixed-bg,
.fixed-bg2{
  background-position: center;
  height:100%;
  width:100%;
  margin:0;
  position:absolute;
  left:0;
  top:0;
  z-index:-2;
}
.fixed-bg{
  background-attachment:fixed;
  background-size:cover;
}
.fixed-bg2 {
  background-attachment: scroll;
  background-size:cover;
}
.fixed-bg2.pattern-bg,
.fixed-bg.pattern-bg {background-size: initial;}
.fixed-bg.wt-gry-bg,
.fixed-bg2.wt-gry-bg {background-color: #f5f5f5;}
.fixed-bg.wt-blk-bg,
.fixed-bg2.wt-blk-bg {background-color: #1e1d1d;}
.black-layer:before,
.black-layer2:before,
.black-layer3:before,
.black-layer4:before, 
.white-layer:before,
.gray-layer:before,
.ylsh-layer:before,
.theme-bg-layer:before {
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}
.white-layer:before {background-color:#fff;}
.gray-layer:before {background-color: #f5f5f5}
.black-layer:before {background-color: #000000;}
.black-layer2:before {background-color: #171717;}
.black-layer3:before {background-color: #272727;}
.black-layer4:before {background-color: #070500;}
.ylsh-layer:before {background-color: #171101;}
.hlf-parallax.theme-bg-layer:before,
.hlf-parallax .fixed-bg,
.hlf-parallax .fixed-bg2 {height: 80%;}
.opc1:before {opacity: .1;}
.opc15:before {opacity: .15;}
.opc2:before {opacity: .2;}
.opc25:before {opacity: .25;}
.opc3:before {opacity: .3;}
.opc35:before {opacity: .35;}
.opc4:before {opacity: .4;}
.opc45:before {opacity: .45;}
.opc5:before {opacity: .5;}
.opc55:before {opacity: .55;}
.opc6:before {opacity: .6;}
.opc65:before {opacity: .65;}
.opc7:before {opacity: .7;}
.opc75:before {opacity: .75;}
.opc8:before {opacity: .8;}
.opc85:before {opacity: .85;}
.opc9:before {opacity: .9;}
.opc95:before {opacity: .95;}
iframe {
  border: 0;
  width: 100%;
}
img {
  max-width: 100%;
  vertical-align: middle;
}

/*===== Cross Browser Compatibility =====*/
i,
a,
p,
img,
input,
button,
textarea,
:before,
:after
{
  -webkit-transition: all .3s linear;
  -ms-transition: all .3s linear;
  -o-transition: all .3s linear;
  transition: all .3s linear;
}


.menu-box,
.rsnp-mnu
{
  -webkit-transition:all 600ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
  -moz-transition:all 600ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
  -o-transition:all 600ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
  transition:all 600ms cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
  -webkit-transition-timing-function:cubic-bezier(0.770, 0.000, 0.175, 1.000); 
  -moz-transition-timing-function:cubic-bezier(0.770, 0.000, 0.175, 1.000); 
  -o-transition-timing-function:cubic-bezier(0.770, 0.000, 0.175, 1.000); 
  transition-timing-function:cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
}


{
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}


{
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}


{
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.brd-rd5
{
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.brd-rd4
{
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.brd-rd3
{
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.fltr-btns {
  padding-left: 0;
  list-style: none;
  margin-bottom: 15px;
  display: inline-block;
}
.fltr-btns > li {
  display: inline-block;
  font-family: poppins;
  font-size: 17px;
  letter-spacing: 0;
  color: #313131;
  margin: 0 20px 15px;
  position: relative;
}
.fltr-btns > li > a {
  display: inline-block;
  position: relative;
}
.fltr-btns > li > a:before {
  content: "";
  height: 3px;
  position: absolute;
  left: 0;
  right: 0;
  background-color: #303030;
  bottom: -4px;
  -webkit-transform: scaleX(.4);
  -ms-transform: scaleX(.4);
  -o-transform: scaleX(.4);
  transform: scaleX(.4);
  opacity: 0;
}
.fltr-btns > li > a:hover:before,
.fltr-btns > li.active > a::before {
  -webkit-transform: scaleX(1);
  -ms-transform: scaleX(1);
  -o-transform: scaleX(1);
  transform: scaleX(1);
  opacity: 1;
}
.fltr-btns > li > a:hover, 
.fltr-btns > li.active > a {color: #313131;}
.fltr-btns > li + li:before {
  content: "-";
  left: -23px;
  position: absolute;
}
/*===== Bottom Bar =====*/
.btm-br {
  float: left;
  padding: 24px 20px;
  width: 100%;
  background-color: #161616;
  position: relative;
}
.btm-br p {
  margin-bottom: 0;
  font-size: 15px;
  color: #616262;
  letter-spacing: 0;
  display: inline-block;
}
.fltr-btns.style3 {margin-bottom: 30px;}
.fltr-btns.style3 > li > a:hover::before, 
.fltr-btns.style3 > li.active > a::before {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  width: 100%;
}
.fltr-btns.style3 > li > a:before {
  width: 0;
  bottom: 3px;
  z-index: -1;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  height: 4px;
}
.fltr-btns.style3 > li:before {display: none;}
.fltr-btns.style3 > li {
  font-size: 14px;
  font-weight: 700;
  color: #1f1f1f;
  letter-spacing: .5px;
}

.lnd-feat {
  float: left;
  padding: 70px 0;
  width: 100%;
}
.lnd-feat > h1 {
  color: #fff;
  font-size: 50px;
  margin-bottom: 10px;
}
.lnd-feat > a {
  display: inline-block;
  background-color: #333;
  color: #fff;
  font-family: open sans;
  font-weight: 600;
  font-size: 14px;
  padding: 20px 50px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  margin-top: 30px;
}
.sec-tl3 {
  float: left;
  margin-bottom: 40px;
  width: 100%;
}
.sec-tl3 > i {
  font-style: normal;
  font-family: open sans;
  font-size: 60px;
  font-weight: 600;
}
.sec-tl3 > h2 {font-size: 80px;}
.sec-tl3 > p {
  margin-bottom: 0;
  display: inline-block;
  max-width: 60%;
}
.prjcts-wrp {
  float: left;
  width: 100%;
}
.prjcts-inrg {
  float: left;
  width: 100%;
}
.demo-bx {
  float: left;
  position: relative;
  width: 100%;
  -webkit-box-shadow: 0 0 100px rgba(0,0,0,.1);
  -ms-box-shadow: 0 0 100px rgba(0,0,0,.1);
  -o-box-shadow: 0 0 100px rgba(0,0,0,.1);
  box-shadow: 0 0 100px rgba(0,0,0,.1);
  -webkit-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden;
}
.demo-bx > img {width: 100%;}
.demo-bx > a {
  position: absolute;
  left: 50%;
  top: 70%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 700;
  padding: 14px 35px;
  opacity: 0;
  visibility: hidden;
}
.demo-bx > h4 {
  padding: 25px 0;
  font-size: 22px;
  margin-bottom: 0;
  font-weight: 600;
}
.remove-ext3 .demo-bx {margin-bottom: 30px;}
.demo-bx:before {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 90%;
  content: "";
  background-color: #000;
  opacity: 0;
}
.demo-bx:hover:before {
  opacity: .5;
  bottom: 0;
}
.demo-bx:hover > a {
  opacity: 1;
  top: 50%;
  visibility: visible;
}
.demo-bx > a:hover,
.demo-bx > a:focus {
  background-color: #333;
  color: #fff;
}