/*
 * =================================================================== 
 *
 *  Nahtem Main Stylesheet
 *  url: .com
 *  12-3-2017
 * -------------------------------------------------------------------
 *
 *  TOC:   
 * 1-01. webfonts and iconfonts 
 * 1-02. base style overrides
 * 1-03. common styles

 **** Home *****
 1- services
 2- portfolio




 /** 
 * ===================================================================
 * webfonts and iconfonts 
 *
 * ------------------------------------------------------------------- 
 */

@import url('https://fonts.googleapis.com/css?family=Cairo:300,400,600,700');
body {
   font-family: 'Cairo', sans-serif;

   
    font-size: 16px;
    color: #565859;
    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
}
@media only screen and (max-width:1024px) {
  html {
    font-size: 9.375px;

  }
}
@media only screen and (max-width:768px) {
  html {
    font-size: 10px;

  }
  h3
  {
    font-size: 25px;
  }
}
@media only screen and (max-width:400px) {
  html {
    font-size: 9.375px;
  }
}
 p, a, li, blockquote, label, span {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 22px;
    color: #999999;
    margin-bottom: 0;
}
/*
*-
* common styles
*
*/

.m-t-20
{
  margin-top: 20px;
}
.m-b-20
{
  margin-bottom: 20px
}
.m-t-15
{
  margin-top: 15px;
}
.m-t-10
{
  margin-top: 10px;
}
.m-b-10
{
  margin-bottom: 10px;
}
.m-b-5
{
  margin-bottom: 5px;
}
.m-t-5
{
  margin-top: 5px;
}
.m-t-60
{
  margin-top: 60px
}

/*color*/
.main-color
{
    color: #565859;
}
.secound-color
{
  color: #e6330e;
}  
.background-section
{
 background: -moz-linear-gradient(top, rgb(228, 241, 249) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(228, 241, 249) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(228, 241, 249) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}
.white-color
{
  color: #fff;
}


/*border*/
.main_border
{
  border:1px solid #DFDFDF;
      border-radius: 15px;
}
.main-boxshadow
{
          box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12);

}
.pharg
{
  color: #999;
      font-size: .8em;
}
.section-heading h1 {
    display: inline-block;
    font-size: 55px;
    font-weight: 300;
    margin-bottom: 0;
}
.section-heading {
    margin: 60px 0 80px;
    text-align: center;
}
section .section-heading .divider:after {
    background: #ffd400;
}


.section-heading .divider:after {
    content: "";
    position: relative;
    height: 4px;
    width: 60px;
    display: block;
    text-align: center;
    margin: 13px auto;
    -webkit-border-radius: 5em;
    -moz-border-radius: 5em;
    -ms-border-radius: 5em;
    -o-border-radius: 5em;
    border-radius: 5em;
}

section {
    position: relative;
    padding-bottom: 90px;
}
.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    height: 48PX;
    width: 100%;
    margin-bottom: 0;
}
form textarea.form-control {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
    height: auto;
    line-height: normal;
}
/* Links */
a {
    
    word-wrap: break-word;

    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

a:hover,
a:focus {
    text-decoration: none;
    outline: 0;
}

/*
*
* common Style
*/
.btn-primary
{
      background-color: transparent;
    border: 2px solid #999;
    color: #fff;
    transition: all 0.4s;
        padding: 6px 34px;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary.active:hover, .btn-primary.active:focus
 {
       box-shadow: 0 7px 20px 5px rgba(50, 63, 14, 0.3);
          background-color: #fff;
                    border-color: #fff;

    outline: none !important;
    
    transition: all 0.3s;
    color: #ffd400;
}
.btn-danger
{
      background-color: transparent;
    border-color: #ffd400;
    color: #ffd400;
    transition: all 0.4s;
        padding: 6px 34px;
}

.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .open .dropdown-toggle.btn-danger, .btn-danger:active:focus, .btn-danger:active:hover, .btn-danger.active:hover, .btn-danger.active:focus
 {
       box-shadow: 0 7px 20px 5px rgba(50, 63, 14, 0.3);
          background-color: #fff;
                    border-color: #fff;

    outline: none !important;
    
    transition: all 0.3s;
    color: #ffd400;
}
.btn-rounded {
  border-radius: 50px;
}

.section-title 
{
  color: #565859;
  
  font-weight: bold;
}



/*offer*/
.owl-carousel .owl-wrapper-outer
{
  direction: ltr;
}
#owl-demo .item{
    margin: 1.3em;
    padding: 42px;
        border: 1px solid #fff;
        background-color: #fff;
            min-height: 35em;

}
#owl-demo1 .item {
    margin: 15px;
    padding: 2em;
        border: 1px solid #fff;
        background-color: #fff;
            min-height: 10em;
            border-radius: 22px;
            box-shadow: 9px 9px 15px -10px rgba(50, 63, 14, 0.3);

}
#owl-demo1 .item .part1 a
{
  color: #565859
}
#owl-demo1 .item img {
  max-width: 128px;
  min-width: 128px;
  max-height: 128px;
  min-height: 128px;
}
.owl-theme .owl-controls .owl-page {
    display: inline-block;
}
.owl-theme .owl-controls .owl-page span {
    background: none repeat scroll 0 0 #565859;
    border-radius: 20px;
    display: block;
    height: 12px;
    margin: 5px 7px;
    opacity: 0.5;
    width: 12px;
}

#owl-demo1 .item:hover, #owl-demo1 .item.active {
    border: 1px solid transparent;
    -webkit-box-shadow: 0 10px 36px rgba(177, 204, 239, 0.32), 0 3px 6px rgba(205, 219, 236, 0.58);
    -moz-box-shadow:0 10px 36px rgba(177, 204, 239, 0.32), 0 3px 6px rgba(205, 219, 236, 0.58);
    box-shadow: 0 10px 36px rgba(177, 204, 239, 0.32), 0 3px 6px rgba(205, 219, 236, 0.58);
}
#adver .owl-theme .owl-controls .owl-page span {
    background: none repeat scroll 0 0 #fff0;
    border-radius: 20px;
    display: block;
    height: 12px;
    margin: 5px 7px;
    opacity: 0.5;
    width: 12px;
}
.section {
    padding: 100px 0;
}

.bg-2 {
    background: url(../img/elipse-bg.png) no-repeat;
    background-size: cover;
}
.shadow, .about .about-block .about-item, .screenshots .screenshot-slider .image img, .counter .counter-item, .team-member, .service .service-box, .founder img, .team-sm .image img, .post-sm, .job-list .block, .privacy .block, .user-login .block .image img, .coming-soon .block .count-down .syotimer-cell {
  box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.05);
}
.about .about-block .about-item
{
      box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.05);
}
.about .about-block
{
  margin-top: 5em
}
@media (max-width: 768px) {
  .about .about-block
{
  margin-top: 2em
}
 
}
@media (max-width: 768px) {
  .about .image-block {
    
    text-align: center;
    margin-bottom: 30px;
  }
}

.about .about-block .about-item {
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 30px;
}

.about .about-block .about-item.active {
  background: #ef4d45 ;
}

.about .about-block .about-item.active .icon i {
  color: #fff;
}

.about .about-block .about-item.active .content h5, .about .about-block .about-item.active .content p {
  color: #fff;
}

.about .about-block .about-item .icon {
  width: 50px;
}

.about .about-block .about-item .icon i {
  font-size: 48px;
  color: #ef4d45 ;
}

.about .about-block .about-item .content {
  margin-right: 30px;
}

.about .about-block .about-item .content h5 {
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 15px;
}

.about .about-block .about-item:not(:last-child) {
  margin-bottom: 30px;
}
/*feature*/
.bg-elipse {
    background: url(../img/elipse-bg-three.png) no-repeat;
    background-position: center;
}
/*End Feature*/
.feature .feature-item .icon i {
    font-size: 48px;
    color: #ef4d45 ;
}
.feature .feature-item .content h5 {
    font-weight: 600;
    margin-bottom: 15px;
}
.feature .feature-item {
    margin-bottom: 80px;
}
.section-title {
    text-align: center;
    margin-bottom: 85px;
}
.section-title h2 {
    font-size: 48px;
    font-weight: 300;
    margin-bottom: 30px;
    font-weight: 300;
}
.section-title p {
    width: 70%;
    margin: 0 auto;
    font-size: 16px;
    line-height: 30px;
}
/*download*/
.cta-download {
    position: relative;
    padding: 165px 0;
}

.bg-3 {
    background: url(../img/desk-bg.jpg) fixed no-repeat;
    background-size: cover;
}
.overlay:before {
    content: '';
    background: rgba(239, 77, 69, 0.92);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.cta-download .image-block {
  position: absolute;
  top: -245px;
}


@media (max-width: 768px) {
  .cta-download .image-block {
    display: none;
  }

}

.cta-download .content-block h2, .cta-download .content-block p {
  color: #fff;
}

.cta-download .content-block h2 {
  font-weight: 300;

  margin-bottom: 30px;
}

.cta-download .content-block p {
  line-height: 30px;
  margin-bottom: 40px;
}

@media (min-width: 768px) {
  .cta-download  .content-block
{
padding-right: 3em;
}
}
/*subscribe*/
.bg-elipse-red {
    background: url(../img/elipse-bg-two.png) no-repeat;
    background-position: center;
}
.cta-subscribe .content .title h2 {
    
    font-weight: 300;
}
.input-group {
    box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.05);
    border-radius: 4px;
}
.input-group .input-group-addon {
    padding-left: 35px;
    padding-right: 35px;
    background: #7d71d3;
    color: #fff;
    cursor: pointer;
}
/*footer*/
footer {
    padding: 80px 0;
    text-align: center;
}
footer {
    background: linear-gradient(45deg, #ef8580 0%, #ef4d45 50%, #ef8580 100%);

}
footer .social a i {
    width: 1em;
}
footer .social a i {
    color: #ffffff;
}
footer .social {
    display: block;
    margin-top: 30px;
}
footer .social a {
    margin: 0 8px;
    padding: 15px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    display: inline-block;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -ms-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}
footer .social a {
    border: 2px solid #ffffff;
}
footer .rights {
    margin-top: 30px;
}

footer .rights p {
    color: #ffffff;
}
footer .social a:hover i {
    color: #ef4d45 ;
}
footer .social a:hover {
    background: #ffffff;
}
/*screen*/
#screens
{
      background: #f7f7f7;
}
section#screens .slider {
  margin: 50px 0;
}
section#screens .slider div img {
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  padding: 10px;
  display: inline;
}
section#screens .slider div h4 {
  text-align: center;
  margin-top: 40px;
  font-size: 16px;
}
section#screens .slider .slick-dots li button {
  -webkit-border-radius: 5em;
  -moz-border-radius: 5em;
  -ms-border-radius: 5em;
  -o-border-radius: 5em;
  border-radius: 5em;
}
section#screens .slick-prev,
section#screens .slick-next {
  width: 50px;
  height: 50px;
  top: 44%;
}
section#screens .slick-slide {
  text-align: center;
}
section#screens .slick-prev:before {
  content: "\f104";
}
section#screens .slick-next:before {
  content: "\f105";
}
section#screens .slick-prev:before,
section#screens .slick-next:before {
  font-size: 34px;
  -webkit-border-radius: 5em;
  -moz-border-radius: 5em;
  -ms-border-radius: 5em;
  -o-border-radius: 5em;
  border-radius: 5em;
  line-height: 45px;
  color: #CCC;
  border: 2px solid #CCC;
  width: 50px;
  display: inline-block;
  height: 50px;
  text-align: center;
}
section#screens .filter {
  text-align: center;
}
section#screens .filter a {
  display: inline-block;
  padding: 7px 20px;
  text-decoration: none;
  -webkit-border-radius: 5em;
  -moz-border-radius: 5em;
  -ms-border-radius: 5em;
  -o-border-radius: 5em;
  border-radius: 5em;
  margin: 10px 5px;
  text-transform: uppercase;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
section#screens header h1:after {
  background: #565859;
}
section#screens .slider div img {
  border: 2px solid #e5e5e5;
}
section#screens .slider div h4 {
  color: #999999;
}
section#screens .slider .slick-dots li button {
  background: #999999;
}
section#screens .slider .slick-dots li.slick-active button {
  background: #565859;
}
section#screens .filter a {
  border: 2px solid #cccccc;
  color: #999999;
}
section#screens .filter a:hover {
  color: #ffffff;
  background: #565859;
  border-color: #565859;
}
section#screens .filter a.active {
  color: #ffffff;
  background: #565859;
  border-color: #565859;
}
.slick-prev:before, .slick-next:before {
     font-family: "Font Awesome 5 Solid";
    font-size: 40px;
    line-height: 1;
    color: #ccc;
    opacity: 0.85;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-next:before {
    font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f007";

}
.slick-prev:before {
        font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f007";

}
.popover.bottom
        {
              z-index: 999999999999999999!important;
        }