/*
    Theme Name: App
    Theme Coder: Mohamed Sebai
    psd Designer: Thanks for him
 */
 /* Start Main Rualez */
body{
  position: relative;
  background-color: #eee;
  background: url(../img/cover-body.jpg) top center no-repeat;
  background-size: 100% 100%;
  background-attachment: fixed;
}
body .overlay-body{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .5);
  z-index: 1;
}
 /* End Main Rualez */
/* Start Header */
.header{
  overflow: hidden;
  position: relative;
  background: url(../img/cover.jpg) top center no-repeat;
  background-size: 100% 100%;
  height: 100vh;
}
.header .overlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .5);
  z-index: 1;
}
.header .navbar,
.header .description{
    z-index: 2;
}
.header .navbar{
  position: fixed;
  width: 100%;
  z-index: 999;
  transition: .4s;
  background-color: #e3ab0000;
}
@media (max-width: 991px){
  .header .navbar{
    background : #e3ab00 !important;
  }
}
.header .navbar .navbar-brand{
  font-size: 30px;
  color: #fff;
  font-weight: bold;
}
.header .navbar .navbar-brand span{
  font-size: 34px;
  color: #28a745;
}
.header .navbar .navbar-collapse{
  flex-grow: 0;
}
.header .navbar .nav-item .nav-link{
  margin-right: 60px;
  padding-left: 10px;
  color: #eeeeee;
  font-size: 20px;
  transition: .4s;
}
.active-link{
  color: #28a745;
}
.header .navbar .nav-item .nav-link.active-link{
  color: #28a745;
}
.header .navbar .nav-item .nav-link:hover{
  color: #28a745;
}
.header .navbar .nav-item:last-of-type{
  margin-right: 100px;
}
.header .navbar .nav-icon{
  margin-top: 12px;
}
@media (max-width: 991px) {
  .header .navbar .nav-icon{
    margin-bottom: 20px;
  }
}
.header .navbar .nav-icon .nav-icon-link i{
 color: #1f1b0e;
 padding-bottom: 5px;
}
.header .description{
  position: absolute;
  top: 35%;
  color: #fff;
  display: none;
}
@media (max-width: 991px){
  .header .description{
    z-index: 1;
  }
  .header .description h4{
    font-size: 20px;
  }
}
.header .description h4{
  font-size: 40px;
}
@media (max-width: 991px){
  .header .description h4{
    font-size: 30px;
  }
}
.header .description p{
  font-size: 18px;
  color: #f1f1f1;
  margin-top: 20px;
}
.header .description a{
  margin-top: 20px;
}
.header .img-box{
  position: absolute;
  right: -219px;
  max-height: 450px;
  margin-top: 100px;
}
@media (max-width: 991px){
  .header .img-box{
    display: none !important
  }
}
.header .img-box img{
  max-height: inherit;
}

/* End Header */
/* Start Featuers Section */
.featusers .featusers-box{
  background-color: #ffffff45;
  margin: 100px 0 50px;
  padding: 50px 0;
  position: relative;
  overflow: hidden;
}
.featusers .featusers-box .title-box{
  line-height: 1.7;
  font-weight: bold;
  color: #fff;
}
.featusers .featusers-box .title-box h2{
  font-weight: bold;
  font-size: 35px;
}
.featusers .featusers-box .title-box p{
  margin-bottom: 40px;
  font-size: 20px;
}
.featusers .featusers-box .feat-box{
  position: relative;
  top: 297px;
  max-height: 259px;
  cursor: pointer;
  transition-timing-function: ease-in-out;
  padding: 40px 20px;
  background-color: #000;
  box-shadow: 0px 1px 9px #ffc107;
  margin-bottom: 30px;
  color: #fff
}
.featusers .featusers-box .feat-box i{
  margin-bottom: 15px;
  font-size: 36px;
}
/* End Featuers Section */

/* Start Simple Widgets */
.simple-widgets{
  margin-top: 150px;
  overflow: hidden;
}
.simple-widgets .title-box{
  line-height: 1.7;
  font-weight: bold;
  color: #fff;
  margin-bottom: 50px;
}
.simple-widgets .title-box h2{
  font-weight: bold;
  font-size: 35px;
}
.simple-widgets .carousel{
  padding: 30px 0;
}
.simple-widgets .carousel .carousel-indicators{
  bottom: -25px;
}
@media (min-width: 768px){
  .simple-widgets .carousel .carousel-indicators{
    display: none;
  }
}
.simple-widgets .carousel .carousel-indicators li{
  width: 12px;
  height: 7px;
}
@media (min-width: 992px){
  .simple-widgets .carousel-inner .carousel-item .col-4{
    padding: 0 100px;
  }
}
.simple-widgets .carousel-inner .carousel-item img{
  max-width: 200px;
  position: relative;
  top: 415px;
}
.simple-widgets .carousel .carousel-control-next,
.simple-widgets .carousel .carousel-control-prev{
  height: 50px;
  width: 100px;
  top: 50%;
}
@media (max-width: 767px){
  .simple-widgets .carousel .carousel-control-next,
  .simple-widgets .carousel .carousel-control-prev{
     display: none;
  }
}
@media (max-width: 767px) {
   .simple-widgets .carousel .carousel-control-next,
   .simple-widgets .carousel .carousel-control-prev{
    top: 45%;
  }
}
.simple-widgets .carousel .carousel-control-prev .carousel-control-prev-icon,
.simple-widgets .carousel .carousel-control-next .carousel-control-next-icon{
 height: 20px;
 background-color: #ff9800;
 width: 20px;
 position: relative;
 background-image: url("data:image/svg+xml,%1csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e")
}
.simple-widgets .carousel .carousel-control-next .carousel-control-next-icon i,
.simple-widgets .carousel .carousel-control-prev .carousel-control-prev-icon i{
  color: #000;
  position: absolute;
  left: 50%;
  top: 50%;
  color: #333;
  transform: translate( -50%, -50%);
}
/* End Simple Widgets */

/* Start New Featuers */
.new-featuers{
  margin: 50px 0;
  padding: 40px 0;
  background-color: #ffffff45;
  color: #fff;
  overflow: hidden;
}
/* *********Start Featuers Image-Box */
.new-featuers .img-box{
 position: relative;
}
@media (min-width: 992px){
  .new-featuers .img-box{
    left: -400px;
  }
}
@media (max-width: 991px){
  .new-featuers .img-box{
    bottom: 530px;
  }
}
@media (max-width: 991px){
  .new-featuers .img-box img{
    margin-left: 52%;
  }
}

/* **********Start Featuers NewFeat Box */
.new-featuers .newfeat-box{
 position: relative;
 margin-top: 20px;
}
@media (min-width: 992px){
  .new-featuers .newfeat-box{
    right: -849px;
  }
}
@media (max-width: 991px){
  .new-featuers .newfeat-box{
     top: 510px;
  }
}
@media (max-width: 991px){
  .new-featuers .newfeat-box .feat{
    text-align: center;
  }
}
.new-featuers .newfeat-box .feat h2,
.new-featuers .newfeat-box .feat p{
  margin-bottom: 24px;
}
.new-featuers .newfeat-box .feat ul li{
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #333;
  text-align: center;
  margin-left: 10px;
  cursor: pointer;
}
.new-featuers .newfeat-box .feat ul li a{
  color: #fff;
  line-height: 50px;
}
/* End New Featuers */


/* Start Powerful Featusers */
.Powerful-featuers{
  margin-top: 50px;
  padding: 40px 0;
  color: #fff;
  overflow: hidden;
}
.Powerful-featuers .newfeat-box{
 position: relative;
 margin-top: 90px;
 margin-bottom: 50px;
}
@media (min-width: 992px){
  .Powerful-featuers .newfeat-box{
    left: -640px;
  }
}
@media (max-width: 991px){
  .Powerful-featuers .newfeat-box{
     display: none;
  }
}

@media (min-width: 700px) and (max-width: 992px){
  .Powerful-featuers .newfeat-box{
    margin-top: 50px;
  }
}

@media (max-width: 991px){
  .Powerful-featuers .newfeat-box .feat{
    text-align: center;
  }
}
.Powerful-featuers .newfeat-box .feat h2,
.Powerful-featuers .newfeat-box .feat p{
  margin-bottom: 24px;
}
.Powerful-featuers .newfeat-box .feat ul li{
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #333;
  text-align: center;
  margin-left: 10px;
  cursor: pointer;
}
.Powerful-featuers .newfeat-box .feat ul li a{
  color: #fff;
  line-height: 50px;
}

/* Start Imge Box */
.Powerful-featuers .img-box{
    position: relative;
  }
@media (min-width: 992px){
  .Powerful-featuers .img-box{
    right: -375px;
  }
}
@media (max-width: 991px){
  .Powerful-featuers .img-box{
     display: none;
  }
}
@media (max-width: 991px){
  .Powerful-featuers .img-box img{
    margin-left: 40%;
  }
}
/* End Powerful Featusers */

/* Start what they say about us */

.What-they-say{
  margin: 40px 0;
  padding: 40px 0;
  background-color: #ffffff45;
  color: #fff
}
.What-they-say .title-box{
  margin-bottom: 30px;
  color: #000
}
.What-they-say .say-box{
  background-color: #a88c3678;
  padding: 20px 15px 40px;
  margin-bottom: 30px;
}
.What-they-say .say-box h5{
  color: #000
}
.What-they-say .say-box .before-icon{
  margin-bottom: 20px;
}
.What-they-say .say-box .before-icon,
.What-they-say .say-box .after-icon{
  font-size: 25px;
  color: #d0c29a;
}
/* Start what they say about us */

/* Start How Download App */
.how-download{
  margin: 60px 0 50px 0;
  color: #fff;
  background: url(../img/how-download.jpg) top center no-repeat;
  background-size: 100% 100%;
  height: 55vh;
}
.how-download .download-description{
  margin-top: 40px;
  display: none;
}
.how-download .download-description p{
  margin: 20px 0;
}
.how-download .download-description .icon-box{
  margin-top: 30px;
}
.how-download .download-description .icon-box .first,
.how-download .download-description .icon-box .last{
  display: none;
}
/* End How Download App */

/* Start Footer Section */
.footer{
  color: #fff;
  background: #e3ab00;
  margin-top: 50px;
  padding: 50px 0;
}
.footer .brand{
  font-weight: bold;
}
@media (max-width: 991px){
  .footer .brand{
    text-align: center;
  }
}
.footer .brand h2 span{
  color: #61a830;
  font-size: 40px;
}
.footer .links .links-list{
  font-size: 20px;
}
.footer .links .links-list .links-icon{
  width: 25%;
}
.footer .links .links-list .links-icon .nav-link{
  color: #fff;
  transition: .4s;
}
.active-link{
  color: #61a830 !important;
}
.footer .links .links-list .links-icon .nav-link:hover{
  color: #61a830
}
.footer .icon .nav-icon-link{
  color: #1f1b0e;
}
@media (max-width: 991px){
  .footer .icon{
    text-align: center;
    margin: 30px 0;
  }
}
.footer .copyright{
  position: relative;
  margin-top: 40px;
  border-top: 2px solid #61a830;
  padding: 50px 0 0 0;
}
.footer .copyright a{
  margin-left: 10px;
  font-size: 15px;
}

/* End Footer Section */